第一章：javascript
簡介：
• Java是sun公司開發的一種面向對象的程式開發語言，主要用來開發軟體，是傳統的程式設計語言，需要“編寫-編譯-連結-運作“。而JS腳本語言，隻需經過”編寫-運作”兩個步驟。
• JavaScript 是一種基于對象和事件驅動并具有安全性能的腳本語言，是一種計算機用戶端腳本語言/解釋性腳本語言，主要在浏覽器解釋執行。本身不進行預編譯。創作目的就是為了分擔伺服器的負擔，減少與伺服器互動所占用的時間。
編譯就是把進階語言變成計算機可以識别的2進制語言。
如：C語言中的代碼：printf(“hello world”);轉換為：10101010010………………
使用JavaScript實作網頁的互動與動态效果。如淘寶網頁的動态廣告效果。
- html：頁面結構。
- css：頁面樣式
-
javascript：頁面行為（動态效果）(能把下拉效果做的更簡潔更炫)
使用var關鍵字進行變量的定義
變量的類型取決于變量裡面存儲的值
變量命名:
1. JavaScript變量名區分大小寫
2. 變量名不能以數字開頭
3. 變量名不能使用關鍵字,保留字
4. 單個單詞的變量名,就都小寫, 多個單詞構成的變量,
5. 第一個單詞首字母小寫,後面的單詞首字母大寫的
6. 不能使用拼音的命名方式
特點：
• 動态類型：不用給變量指定資料類型
var num; //定義一個變量，變量名為num
num=1; //此時變量類型是Number類型，變量值為1
num="hello world" //此時變量類型是String類型，變量值為 hello world
• 弱類型： 一個變量可以賦不同類型的值
num=1; //此時變量類型是Number類型，變量值為1
num="hello world" //此時變量類型是String類型，變量值為 hello world
• 簡單性—— 解釋性語言，不需要編譯，友善調試
• 跨平台性—— 依賴浏覽器本身，與操作環境無關
• 必要性—— 主流浏覽器統一支援的語言
• 相容性差—— 因為依賴于浏覽器執行，是以受各浏覽器影響，相容性較差。
alert：（全名windows.alert()）
提示資訊,在浏覽器中彈出一個提醒框
<script type=“text/javascript”>
alert( ‘Hello JavaScript’ );
</script>
解釋：
<script>标簽表示這是一段腳本語言，具體類型type=“text/javascript”
在 HTML 檔案中，任何 JavaScript 代碼必須放到 <script> 标簽中
<script>通常放在<head>之中、<body>之後
外部JavaScript檔案：
把JavaScript代碼放到外部檔案中，在HTML代碼中直接引入該檔案
外部檔案名稱定義為：檔案名.js
外部檔案可以在HTML中的 head 或 body 中引入
一次定義可以重複使用
外部腳本檔案中，不能含有script标簽，隻能含有javaScript代碼
//這是内部JavaScript檔案的代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Web開發-第一章</title>
<script src="第一章-1.js"></script>
//引入外部檔案時，HTML 檔案的 script标簽中間不能寫 任何JavaScript 代碼。
//即上面一行代碼标簽中間不能有任何東西。
<script type="text/javascript">
alert('這是内部js檔案的代碼');
</script>
</head>
<body>
</body>
</html>
//這是"第一章-1.js"外部引用的javascript檔案的代碼
alert("這是第一章的外部的js檔案");
第二章：JavaScript基礎文法
文法特點：
• 弱類型:：變量的資料類型可以任意轉換
• 動态類型:：變量聲明建立時不用指定資料類型
• 語句塊：多個語句可放在 “{ }”内，形成一個語句塊
JavaScript 輸出内容的3種方式:
- document.write( )
//頁面輸出内容（在網頁内容中直接顯示） //裡面可以放html标簽并正常使用，但是标簽必須在雙引号裡面。 - console.log( )
//控制台輸出（浏覽器打開後按F12進入控制台模式） - alert( )
//彈出框輸出
三種輸出方式
alert("hello world"); //彈框
console.log("welcome") //控制台
document.write("hello world<br/>"); //頁面輸出
//document.writeln會自動加空格，不能換行，換行用<br/>
document.write("<a href='https://www.bing.com'>必應</a> ");
document.write("<br/>");
document.write("<button>按鈕</button>");
JavaScript 變量及内置資料類型
使用關鍵字var建立變量，區分大小寫，隻能以字母 ，-， $這三種形式打頭
JavaScript 為動态類型語言，聲明變量時，不需指明資料類型
JavaScript 原始資料類型
一共有五種：Number、String、Boolean、Undefined、Null
• string用單雙引号括起來
• Boolean（布爾類型）隻有兩種情況true與fals
• Undefined隻有一個值 undefined 指聲明了但未指派的變量
• Null 隻有一個值null，表示值為空。null不等同于空的字元串 (“”) 或 0。
• NaN: 一個沒有意義、不正确的數值，目前變量不是數字。
//判斷變量在某一時刻的資料類型，使用 typeof 運算符
var num1 = 9; //number
var num2='numm'; //string
var num3=true; //boolean(true/fals)
var num4; //undefined(一個隻聲明，沒有指派的變量)
var num5=null; //null（隻是一個“為空的‘值’ ”）類型為object，空對象
var num6=NaN; //NaN一個無意義錯誤的數值,類型為number
var num;//定義變量num
num=1;//變量num指派時類型也随之确定，為Number形
console.log(typeof(num))//通過控制台console.log（）輸出typeof資訊。
JavaScript 是弱類型語言（弱類型是指不同類型的變量之間可以互相指派，但在某一時刻，一個變量隻存在某一種資料類型）
獲得字元串長度：console.log(變量名.length）
//通過控制台輸出長度
判斷變量在某一時刻的資料類型，使用 typeof 運算符
• 認識 NaN (Not a Number)
表示一個沒有意義、不正确的數值，目前變量不是數字。
與自身不相等
• 認識 isNaN( ) 函數
用來檢測參數是否為 NaN 值
參數是 “NaN” 時傳回 true，否則傳回 false
"+"運算符
+兩邊是數字時，結果是兩個數值的運算結果
+兩邊時字元串時，結果是兩個字元串的拼接
var num1=1, num2=2, num3="3";
var num12,num13;
num12=num1+num2//num12=3,類型為Number
//兩邊都是數字，進行純數值運算
num13=num1+num3//num13="13" 類型為String
//一邊是數字，一邊是字元轉，預設進行字元串的拼接
比較運算符
==：兩邊隻要數值相同就為true（不管類型）
===：兩邊的類型和值都必須相同時為 true
var num1=10;
var num2=10;
var str1="10";
// ==判斷變量數值是否相同，不管類型
console.log(num1==num2);
console.log(num1==str1);
// ===先判斷類型，後判斷類型
console.log(num1===num2);
console.log(num1===str1);
console.log(num1===str1 ? "111":"222");
//() 算術 關系 指派
**
都不會改變原值，但是會傳回新的結果
**
隐式轉換
1. 轉換成 String 類型: 用 + 連接配接
2. var num1=123,num2="welcome";
3. var num3=num1+num2;//num3="123welcome"
4. 轉換成 Boolean 類型: 變量前面加 !! （雙感歎号）
5. var num1=1;//Number類型
6. num1=!!num1//Boolean類型
7. var u1 = undefined;
8. var n1 = null;
9. var num3 = u1 + 0; //NaN
10. var num4 = n1 + 0; //0
強制類型轉換
• Boolean(value) - 把給定的值轉換成 Boolean 型；
• Number(value) - 把給定的值轉換成數字（可以是整數或浮點數）；
• String(value) - 把給定的值轉換成字元串；
• 還有parseInt()，parseFloat()，Number();
var num=NULL;//num類型為空
num=Boolea（num）//num類型Boolean
num=Number（num）//num類型Number
num=String（num）//num類型String
轉字元串類型
原類型+ “ ”
//（原類型＋空符串，屬于隐式轉換）
String（）
//強制顯性轉換
轉數字類型
parseInt() , parsefloat()
//字元串轉數字
//僅對原類型為string的變量有效，當其無效時傳回NaN
number（）
//強制顯性轉換
轉布爾類型
!!變量名
//隐式轉換
Boolean( )
//強制轉換為 Boolean 類型:
其他注意事項&&零碎知識點
• “-、*、/、%” 左右出現字元串（布爾）時，将字元串（布爾）轉換為數值類型
• 比較運算符左右出現字元串（布爾），會轉換為數值類型
• 邏輯運算符會将資料類型轉換為布爾類型之後再做運算
• 算術運算符會自動将布爾轉換為數字
• 程式 = 資料 + 算法
•   空格
•
var num1=10;
var num2=10;
var str1="10";
// ==判斷變量類型是否相同
console.log(num1==num2);
// ===先判斷類型，後判斷類型
console.log(num1===num2);
console.log(num1===str1);
console.log(num1===str1 ? "111":"222");
//輸出結果：
// true
// true
// true
// false
// 222
var a="123.456.img";
var a1=parseInt(a);
var a2=parseFloat(a);
document.write("a1="+a1+"<br/>"+"a2="+a2+"<br/>");
document.write(typeof a2+"<br/>");
var b=3.123456;
var b1=b+"";
document.write(typeof(b1)+"<br/>");
b1=Number(b1);
document.write(typeof(b1)+"<br/>");
var c="img"+3+".aaa";
var c1=!!c; 隻要c不為null,傳回值都是true;
document.writeln(typeof(c)+"<br/>");
document.writeln(typeof(c1));
輸出結果
a1=123
a2=123.456
number
string
number
string
boolean
var num=1;
switch(num)
{
case"num>0":
document.write("num>o");
case"num==0":
document.write("num=o");
case"num<0":
document.write("num<o");
case 1:
document.write("1");
default:
document.write("what are you 能啥類");
}
//輸出結果 1 what are you 能啥類
通過document.write();寫表格
document.write("<table align='center' >");
//寫入tr标記
for(var i=0;i<6;++i)
{
document.write("<tr>");
for(var j=0;j<6;++j)
{
document.write("<td>");
document.write("  ");
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>");
document.write("<table align='center'>");
for(var num1=0;num1<6;++num1){
document.write("<tr>");
for(var num2=0;num2<6;++num2){
document.write("<td>");
document.write(" 11 ");
document.write("</td>");
}
document.write("</tr>");
}
document.write("<table>");
![第七章：DOM模型一[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)