JavaScript(一)：HTML嵌入JS方式、js變量、數據類型和函數
概念：JavaScript是運行在瀏覽器上的事件驅動型的腳本編程語言，簡稱JS。
作用：網頁（動態）交互。
1. HTML嵌入JS代碼的三種方式：
-
一、事件句柄 嵌入：（類似於css的內聯定義方式）
-
什么是事件驅動型語言？
在JS中有很多事件，例如
click點擊，並且任何一個事件都有事件句柄，click的事件句柄叫做onclick。（即在事件前加上“on”），這種語言叫做事件驅動型語言。 -
什么是事件句柄？
以HTML標簽的屬性存在，事件不發生，事件句柄中的代碼不執行，當發生事件：例如進行click點擊時，事件句柄后面的代碼才被瀏覽器自動調用。
.../*這里的onclick就是事件句柄*/
<body>
<button
onclick="alert('hello JavaScript');" id="btn" class="anniu">hello JavaScript
</button>
</body>
...
-
二、腳本塊嵌入：（類似於css的樣式塊定義方式）
...
/*這里的script內所有內容就是腳本塊。腳本塊中的程序在頁面打開時自頂向下自動執行。(script腳本塊放在HTML任何位置都能執行。)*/
<body>
<script
type="text/javascript">alert("腳本塊執行");
</script>
</body>
...
-
三、引入外部獨立的js文件方式：（類似於css中引入外部css文件方式）
推薦使用 ↑ .
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="../css/mycss/js.js"></script>
</head>
2. js語言
變量和數據類型
-
變量有兩種：全局變量和局部變量；
-
全局變量（作用域）：瀏覽器開啟被使用，瀏覽器關閉被關閉；
-
局部變量（作用域）：函數調用被使用，函數執行完畢被關閉；
tips：當變量前面沒有var聲明時，自動變成全局變量；
-
-
數據類型是弱類型，有原始類型Undefined、Number、Boolean、Null、 ；引用類型Object及其子類；和Symbol共7種。
-
-
Undefined：只有
undefin一個值。可以手動輸入，也可以不賦值，則系統自動識別為undefined類型·。 -
Number：包括
數字、無窮（infinity）、NaN（Not a Number）； tips : NaN為什么是Number類型？
eg： 10 / 非數字 = ？
此時有除號，應該是數字。但由於分母不為數字且沒有正常結果，此時結果為NaN，就把NaN納入Number類型中。
-
Boolean：
true和false。用在if語句后，和java不同的是，js語言 if 后面括號無論寫什么，都會調用boolean（）方法；此括號內就是 if 后面括號的內容； tips：
1，“a”，Infinity屬於true；
0、“”、NaN、Undefined、null都屬於false； -
Null：只有一個值，null；（typeof null == object）；
<script type="text/javascript"> function printA(i,j){ alert(i/j); } printA(10,"非數字"); </script> -
String：Object的子類；
其中：substr（a,b）和substring（c,d）的區別；
a：startIndex，索引位置
b：lengt，取出字符個數
c：startIndex，索引位置（閉）；
d：endIndex，結束位置（開）；
-
-
-
typeof運算符：
-
在程序運行階段動態獲取變量的數據類型。
typeof運算符的語法格式（共6中，且全部小寫）：
“undefined”、“number”、“string”、“object”、“function”、“boolean”；
用法：動態階段判斷是否為某種數據類型·
<script type="text/javascript"> function printA(i){ alert(typeof i); } printA(1); </script> -
函數（類似於java的方法）
-
名字相同的幾個函數，只執行最下面的那個（覆蓋運行）；
-
當變量多於參數時，未傳入的參數默認為undefined（這也是一個值）；當變量少於參數時，多余的參數去除掉；當等於，正常執行。
-
//需求：對i和j進行相加，下面兩種寫法均正確，第一種類似於java的寫法，第二種也要熟悉。 //1.function 函數名（變量）{函數體} function sumA(i,j){ alert(i+j); } sumA(1,2);//調用函數 //2.函數名=function（變量名）{函數體} sumB= function(i,j){ alert(i+j); } sumB(1,3);//調用函數
...
<head>
<meta charset="UTF-8">
<title>js變量</title>
<script type="text/javascript">
function sumA(i,j){
alert(i+j);
}
</script>
</head>
<body>
<input type="button" onclick="sumA(1,4)" value="點擊計算1+4=？">
</body>
...