<1>javascript介紹

1、JavaScript是執行在瀏覽器端的指令碼語言
2、JavaScript主要解決的是前端與使用者互動的問題，包括使用互動與資料互動，JavaScript是瀏覽器解釋執行的。
3、瀏覽器彈窗

<script>
	alert("helloworld")
</script>

4、控制檯輸出

<script>
	console.log('吃了麼?')
</script>

<2>javascript嵌入頁面的方式

1、內嵌式（學習用）

<script>
 

		alert("你好!")
</script>

2、外鏈式（開發用）

外鏈式： 一個從外部引入的js,後寫的內容不顯示

<script>
	<script type="text/javascript" src="js/index.js"></script>
</script>

3、行內式（行間事件，用這種型別的多用於事件）

<script>
	<input type="button" name="" onclick="alert('ok！');">
	<input type=
 
"button" name="" onclick="alert('ok！');">
</script>

<3>變數、資料型別及基本語法規範

JavaScript 是一種弱型別語言，javascript的變數型別由它的值來決定

1、變數

  定義變數需要用關鍵字 ‘var’，同時定義多個變數可以用","隔開，公用一個‘var’關鍵字

<script>
	var iNum = 45,sTr='qwe',sCount='68';
</script>

2、資料型別

• 基本資料型別：

（1）number 數字型別
（2）string 字串型別
（3）boolean 布林型別 true 或 false
（4）undefined undefined型別，變數宣告未初始化，它的值就是undefined
（5）null型別，表示空物件，如果定義的變數將來準備儲存物件，可以將變數初始化為null,在頁面上獲取不到物件，返回的值就是null。複雜資料型別的不存在，返回null型別。

• 複雜資料型別

（1）object（dict）
（2）array（list）
（3）function（def）

• 檢視資料型別

<script>
	typeof()
</script>

3、javascript語句與註釋

javascript語句開始可縮排也可不縮排，縮排是為了方便程式碼閱讀，一條javascript語句應該以“;”結尾;

• 單行註釋

   // 註釋1: 單行註釋;

• 多行註釋

 /* 
     註釋2: 
      多行註釋
      多行註釋
      多行註釋
*/

4、變數、函式、屬性、函式引數命名規範

1、區分大小寫
2、第一個字元必須是字母、下劃線（_）或者美元符號（$）
3、其他字元可以是字母、下劃線、美元符或數字
4、習慣小駝峰命名
5、匈牙利命名風格：

物件o Object 比如：oDiv
陣列a Array 比如：aItems
字串s String 比如：sUserName
整數i Integer 比如：iItemCount
布林值b Boolean 比如：bIsComplete
浮點數f Float 比如：fPrice
函式fn Function 比如：fnHandler
正則表示式re RegExp 比如：reEmailCheck

<4>函式

含義：函式就是重複執行的程式碼片。

1、函式的定義

<script>
	function 函式名（）{ 程式碼塊  }  // 函式的定義
	函式名（）  // 函式的執行
</script>

2、變數與函式預解析

（1）JavaScript解析過程分為兩個階段

• 編譯階段

編譯階段會將function定義的函式提前，並且將var定義的變數宣告提前，將它賦值為undefined變數只提升變數名，不提升變數值， 函式整體提升（能在定義之前能用函式，不能用變數）

• 執行階段

3、函式傳參及返回值

（1） 函式傳參 javascript的函式中可以傳遞引數。

（2）函式’return’關鍵字

函式中return關鍵字的作用：
 
  1、返回函式中的值或者物件
   2、結束函式的執行

<5>運算子

1、條件運算子

  （1） ==   不判斷型別    ===  需要判斷型別
  （2）>、 >=、 <、 <=、 !=

2、邏輯運算子

     && 、||、!

3、算術運算子

     + 、 -、 * 、 / 、 %

4、賦值運算子

      =、 +=、 -= 、 *= 、 /= 、 %=

5、冪函式

     Math.pow(x,y)

<6>條件語句

通過條件來控制程式的走向

• if else

var iNum01 = 3;
var iNum02 = 5;
var sTr;
if(iNum01>iNum02){
    sTr = '大於';
}
else
{
    sTr = '小於';
}
alert(sTr);

• 多重if else語句

var iNow = 1;
if(iNow==1)
{
    ... ;
}
else if(iNow==2)
{
    ... ;
}
else
{
    ... ;
}

<6>獲取元素方法

  可以使用內建物件document上的getElementById方法來獲取頁面上設定了id屬性的元素，獲取到的是一個html物件，然後將它賦值給一個變數。id是唯一的，出現重名時，取前面的。

<script type="text/javascript">
    var oDiv = document.getElementById('div1');
</script>
....
<div id="div1">這是一個div元素</div>

  上面的語句，如果把javascript寫在元素的上面，就會出錯，因為頁面上從上往下載入執行的，javascript去頁面上獲取元素div1的時候，元素div1還沒有載入，解決方法有兩種：

• 第一種方法：將javascript放到頁面最下邊
• 第二種方法：將javascript語句放到window.onload觸發的函式裡面,獲取元素的語句會在頁面載入完後才執行，就不會出錯了。

window.onload：整個視窗說有標籤全部載入完畢，就會執行後面的函式（入口函式）

<script type="text/javascript">
    window.onload = function(){
        var oDiv = document.getElementById('div1');
    }
</script>

....

<div id="div1">這是一個div元素</div>

<7>操作元素屬性

1、讀取屬性

（1）var 變數 = 元素.屬性名
（2）普通屬性：id href title name src （input中的value屬性，也是普通屬性----經常使用）
（3）獲取雙標籤內部的內容： innerHTML

2、改寫屬性

元素.屬性名 = 新屬性值

3、屬性名在js中的寫法

（1）html的屬性和js裡面屬性寫法一樣
（2）“class” 屬性寫成 “className”
（3）“style” 屬性裡面的屬性，有橫槓的改成駝峰式，比如：“font-size”，改成”style.fontSize”
（4）innerHTML 可以讀取或者寫入標籤包裹的內容,可以獲取值，也可以賦值(可以識別標籤的)

<8>事件屬性及匿名函式

1、常用的事件屬性

  將函式名稱賦值給元素事件屬性，可以將事件和函式關聯起來

（1）滑鼠點選事件屬性(onclick)
（2）滑鼠移入事件屬性(onmouseover)
（3）滑鼠移出事件屬性(onmouseout)

<script type="text/javascript">
	window.onload = function(){
    	var oBtn = document.getElementById('btn1');
   		oBtn.onclick = myalert;
    	function myalert(){
        	alert('ok!');
   	 	}
	}

</script>

2、匿名函式

  定義的函式可以不給名稱可以將匿名函式的定義直接賦值給元素的事件屬性來完成事件和函式的關聯，這樣可以減少函式命名，並且簡化程式碼。

<script type="text/javascript">

	window.onload = function(){
	   var oBtn = document.getElementById('btn1');
	   // 直接將匿名函式賦值給繫結的事件
	   oBtn.onclick = function (){
	       alert('ok!');
	   }
	}

</script>