HTML+CSS+JavaScript基礎學習筆記2---JavaScript入門篇

1.引用
(1)<script type="text/javascript>js代碼</script>
(2)<script src="xxx.js"></script> 外部引入

2.document.write()輸出內容
(1)輸出內容用“”括起來,直接輸出“”中的內容。(2)通過變量輸出內容。 (3)輸出多項內容,內容之間用+號連起來。 (4)輸出html標籤並起作用,標籤用“”括起來。

3.函數:
(1)confirm(str):點擊確定,返回true; 點擊取消,返回false.

<script type="text/javascript">
    var mymessage=confirm("你喜歡JavaScript嗎?");
    if(mymessage==true)
    {   document.write("很好,加油!");   }
    else
    {  document.write("JS功能強大,要學習噢!");   }
</script>

這裏寫圖片描述

(2)prompt(str1,str2):彈出消息對話框(包含一個確定按鈕,取消按鈕與一個文本輸入框)。str1:要顯示在消息對話框中的文本,不可修改;str2:文本框中的內容,可以修改。點擊確定,返回文本框中的內容,點擊取消,返回null.

var myname=prompt("請輸入你的姓名:");
if(myname!=null)
  {   alert("你好"+myname); }
else
  {  alert("你好 my friend.");  }

這裏寫圖片描述
(3)window.open([url],[窗口名稱],[參數字符串])
URL:可選參數,在窗口中要顯示網頁的網址或路徑。如果省略這個參數,或者它的值是空字符串,那麼窗口就不顯示任何文檔。
窗口名稱:可選參數,被打開窗口的名稱。
1.該名稱由字母、數字和下劃線字符組成。
2.”_top”、”_blank”、”_self”具有特殊意義的名稱。
_blank:在新窗口顯示目標網頁
_self:在當前窗口顯示目標網頁
_top:框架網頁中在上部窗口中顯示目標網頁
3.相同 name 的窗口只能創建一個,要想創建多個窗口則 name 不能相同。
4.name 不能包含有空格。
參數字符串:可選參數,設置窗口參數,各參數用逗號隔開。
這裏寫圖片描述

例如:打開http://www.imooc.com網站,大小爲300px * 200px,無菜單,無工具欄,無狀態欄,有滾動條窗口:

<script type="text/javascript"> window.open('http://www.imooc.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')
</script>

4.DOM(Document Object Model)文檔對象模型
JavaScript DOM
這裏寫圖片描述
屬性
(1)innerHTML屬性用於獲取或替換HTML元素的內容
object.innerHTML;(object是獲取的元素對象)
(2)改變HTML元素的樣式
object.style.property = new style;
基本屬性表(property):
這裏寫圖片描述

改變 <p> 元素的樣式,將顏色改爲紅色,字號改爲20,背景顏色改爲藍:

<p id="pcon">Hello World!</p>
<script>
   var mychar = document.getElementById("pcon");
   mychar.style.color="red";
   mychar.style.fontSize="20";
   mychar.style.backgroundColor ="blue";
</script>

(3)顯示和隱藏
object.style.display=none(隱藏)/block(顯示)
(4)className
設置或返回元素的class屬性 object.className=className;

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章