JS簡介
外部JavaScript中文件的文件擴展名為.js，如果使用外部文件，那么標簽需要設置它的src屬性為文件路徑
JavaScript輸出
操作HTML元素
如果需要從JavaScript中訪問HTML中的元素，您可以使用document.getElementById()方法，請使用id屬性標識HTML元素
JavaScript由Web瀏覽器來執行，在這種情況下瀏覽器將訪問id=”demo”的HTML元素并把它的內容（“innerHTML”）替換為”
寫入文檔輸出
document.write(“”);
警告
請使用document.write僅僅寫入內容，如果在文檔完成后執行document.write，整個HTML頁面將被覆蓋
JavaScript語句
JavaScript語句向瀏覽器發出的命令，語句的作用是告訴瀏覽器該做什么，下面的JavaScript語句向id=”demo”的HTML元素輸出文本”Hello,World”
document.getElementById(“id”).innerHTML = “寫入的文本”;
分號用于分隔JavaScript語句
通常我們在每條JavaScript語句結尾添加分號
使用分號的另一條語句是編寫多條語句
，您也有可能看到不帶有分號的案例里，在JavaScript中，用分號來結束語句是可選的
JavaScript代碼
JavaScript代碼（或者只有JavaScript）是JavaScript語句的序列
瀏覽器會按照編寫語句的順序來執行每條語句
JavaScript代碼塊
JavaScript語句通過代碼塊的形式進行組合
JavaScript對大小寫敏感
JavaScript對大小寫是敏感的
當編寫JavaScript語句時，請留意是否關閉大小寫切換鍵
空格
JavaScript會忽略多余的空格，您可以向腳本添加空格，來提高其可讀性
對代碼進行拆行
您知道嗎？
JavaScript是腳本語言。瀏覽器會在讀取代碼時，逐行的執行腳本代碼而對于傳統編程來說，會在執行前對所有代碼進行編譯
JavaScript中的注釋
JavaScript中的注釋可用于提高代碼的可讀性
JavaScript不會執行注釋
我們可以添加注釋對JavaScript進行解釋，或者提高代碼的可讀性
單行注釋以“//”開頭
JavaScript多行注釋
多行注釋以“/*”開頭，以“*/”結尾
使用注釋來阻止執行
在行末使用注釋
JavaScript變量
就像代數那樣
在代數中，我們使用字母來保存值
通過表達式可以計算值
JavaScript變量
變量必須以字母開頭
變量也能以“$”或“_”開頭
變量名稱對大小敏感
JavaScript數據類型
JavaScript變量有很多類型，我們只關注數字和字符串
當向變量分配值的時候應該用雙引號或單引號包圍這個值
當向數字變量分配制的時候，不要使用引號
JavaScript聲明變量
var a = “1”;
var a = 1
一條語句多個變量
var name = ‘’.age = 1;
Value = underfined
在計算機程序中，經常會聲明無值的變量
未使用值來聲明的變量其值實際上是underfined
重新聲明JavaScript變量
如果重新聲明JavaScript變量，該變量的值不會丟失
JavaScript算數
您可以通過JavaScript變量來做算數，使用的是“=”和“+”
JavaScript中的數據類型
字符串、數字、布爾、數組、對象、Null、underfined
JavaScript擁有動態數據類型
JavaScript擁有動態數據類型，這意味著相同的變量可以為不同的數據類型
JavaScript字符串
字符串是存儲字符的變量
字符串可以是引號中的任意文本，您可以使用單引號或雙引號
JavaScript數字
JavaScript只有一種數字類型，數字可以帶小數點也可以不帶
JavaScript布爾
布爾（邏輯），只有兩種數據類型，true和false
JavaScript數組：數組下標是基于0的，所以第一個項目是0第二個是1依次類推
（1）var cars = new Array(); cars[0] = “”; cars[1] = “”
（2）var cars = new Array(“”,””,””);
（3）var = [“”,””,””];
JavaScript對象
對象由花括號分割。在括號內部以名稱和值對的形式來定義屬性由逗號分割
空格和拆行無關緊要，聲明克橫跨多行
var person
{
firstName = “”;
age = “”;
}
underfined和Null
underfined表示不含有值
Null可以通過設置變量的值為Null來清空變量
聲明變量類型
當聲明新變量時，可以使用關鍵字“new”來聲明其類型
JavaScript變量均為對象，當您聲明了一個對象時，就創建了以惡搞新對象。
JavaScript對象
JavaScript中所有的事物都是對象：字符串、數組、日期等等
在JavaScript中，對象是擁有屬性和方法的數據
屬性和方法
屬性是與對象相關的值，方法是能夠在對象上執行的動作
例子：
汽車就是現實生活的對象
汽車的屬性
car.name = “”;
car.model = “”;
汽車的方法
car.start();
JavaScript中的對象
在JavaScript中，對象是數據（變量），擁有屬性和方法
創建JavaScript對象
JavaScript中，幾乎所有的事物都是一個對象：字符串、數組、數字、日期、函數等等
你也可以創建自己的對象
訪問對象的屬性
對象名稱.對象屬性
訪問對象的方法
對象名稱.對象方法
函數
函數是由事件驅動的或者當它被調用時執行的可重復使用的代碼塊
JavaScript的函數語法
函數就是包裹著花括號中的代碼塊，前面使用了關鍵字function
當調用該函數時，會執行函數內部的代碼
可以在某事件發生時直接調用函數（比如當用戶點擊按鈕時）并且可以由JavaScript在任何位置調用，調用帶參數的函數，當您聲明函數時，請把參數作為變量來聲明，變量和參數必須以一致的順序出現，第一個變量就是第一個被傳遞的參數的給定的值
帶有返回值的函數
有時，我們會希望將值返回調用它的地方
通過使用return語句就可以實現
在使用return語句函數會停止執行，并返回指定的值
局部JavaScript變量
在函數內部聲明的變量是局部變量，所以只能在函數內部訪問它，該變量的作用域是局部的，您可以在不同的函數中使用名稱相同的局部變量，因為只有聲明過該變量的函數才能識別該出變量，只要函數運行完畢本地變量就會被刪除
全局JavaScript變量
在函數聲明變量是全局變量，能夠在整個頁面訪問
JavaScript生存期
JavaScript變量的生命期從它們被聲明的時間開始
局部變量會在函數運行以后被刪除
全局變量會在頁面關閉以后被刪除
向未聲明的變量變量分配值
如果您把值賦給未聲明的變量，該變量會自動作為全局變量聲明
JavaScript運算符
運算符=用于賦值
運算符+用于加值
JavaScript算術運算符
+、-、*、/、%、++、--
JavaScript賦值運算符
=、+=、-=、*=、/=、%=
用于字符串的“+”的運算符
“+”運算符用于合并多個字符串為一個字符串
對字符串數組進行加法運算，如果數字與字符串相加，結果為字符串
JavaScript比較運算符：比較變量之間的值
==、===、!=、<、>、<=、>=
JavaScript邏輯運算符：測定變量之間的值
&&、||、!
JavaScript條件運算符：對變量進行賦值的條件表達式，問號表達式
var a = 100 ? 100 : 200
JavaScript if...else if...else...語句
基于不同的條件來執行不同的操作
條件語句
通常在寫代碼時，您總是需要為不同的決定進行不同的操作，您可以在代碼中使用條件語句來完成該任務，在JavaScript中有
if...else當指定條件為true執行if代碼塊，當指定條件為false執行代碼塊
if...只有當指定條件為true才會執行此段代碼
if...else if...多個代碼塊執行條件
Switch多個代碼塊同步執行
循環語句
多次循環執行代碼塊
不同類型的循環
for()
while()
for( ... in ...)
do ... while()
Break終止循環
Continue迭代循環
JavaScript錯誤
try:語句測試代碼塊的錯誤
catch:語句處理的錯誤
throw:語句創建自定義錯誤
錯誤一定會發生
當JavaScript引擎執行JavaScript代碼，會發生各種錯誤，可能是語法錯誤，同場是程序員造成的編碼錯誤或錯別字，可能是拼寫錯誤或語言中缺少的功能（可能由于瀏覽器差異）可能是由于來自服務器或用戶的錯誤輸出而導致的錯誤，當然，也可能是由于許多其它不可預知的因素
JavaScript拋出錯誤
當錯誤發生時當事情出問題時，JavaScript引擎通常會停止，并生成一個錯誤消息
描述這種情況的技術術語是：JavaScript將拋出一個錯誤。
JavaScript測試和捕捉
try：允許我們定義在執行時進行錯誤測試的代碼塊
catch：允許我們定義在執行時進行錯誤處理的代碼塊
throw：創建自定義錯誤，正確的技術術語：創建或拋出異常
異常可以是JavaScript中的字符串、數字、邏輯值、對象
JavaScript表單驗證
JavaScript表單驗證
JavaScript可以在數據提交給服務器之前對HTML進行表單驗證，被JavaScript驗證的這些典型數據：用戶是否已填寫表單中的必填項目？用戶輸入的郵件地址是否合法？用戶是否在數據域中輸入了文本，用戶是否輸入了合法的日期
JavaScript必填（必選）項目
E-mail驗證
JavaScript HTML Dom
Dom簡介
JavaScript能夠改變頁面中所有的HTML元素
JavaScript能夠改變頁面中所有的HTML屬性
JavaScript能夠改變頁面中所有的CSS樣式
JavaScript能夠對頁面中所有事件作出響應
查找HTML元素
通過標簽編號id查找元素
var a = document.getElementById();
通過標簽名稱name查找元素
var a = document.getElementById();
通過標簽類名class查找元素
var a = document.getElementById();
HTML Dom
改變HTML輸出流
JavaScript能夠動態創建HTML的內容document.write()
改變HTML內容
document.getElementById(id).innerHTML =內容
改變HTML屬性
ocument.getElementById(id).屬性=值
改變HTML樣式
document.getElementById(id).style.樣式屬性=值
JavaScript HTML Dom事件
對事件做出響應
我們可以在事件發生時執行JavaScript，比如當用戶元素上點擊時，如需在用戶點擊某個元素時代碼，請向一個HTML事件屬性添加JavaScript代碼
HTML事件案例
當用戶點擊鼠標時
當網頁已加載時
當圖像已加載時
當鼠標移動元素上時
當輸入字段被改變時
當提交到表單時
當用戶觸發按鍵時
HTML事件屬性
如需向HTML元素分配事件，您可以用事件屬性
使用HTML DOM來分配事件
HTML DOM允許您通過JavaScript來分配事件
onload和onunload事件:在用戶進入或離開時觸發
Onload：檢測訪問者的瀏覽器版本和瀏覽器類型，并基于這些信息來加載網頁的正確版本
onload和onunload事件:可用于處理cookie
onchange事件：驗證輸入字段
Onmouseover事件：鼠標停留事件
Onmouseout事件：鼠標離開事件
Onmousedown事件：鼠標按下事件
Onmouseup事件：鼠標彈起事件
Onmouseclick事件：鼠標點擊事件
JavaScript HTML Dom元素節點
創建新的HTML元素：
創建元素：var p = document.createElement(“p”);
創建節點：var a = document.createTextNode(“增加文本”);
追加節點:p.appendChild(a);
查找元素：var d = document.getElementById(id);
追加元素：d.appendChild(p);
刪除已有的HTML元素
創建父元素：var parent = document.getElementById(id);
創建子元素：var child =docuemnt.getElementById(id);
父元素移除子元素：parent.removeChild(child);
JavaScript對象
JavaScript中所有事物都是對象，：字符串、數值、數組、函數等等。JavaScript允許自定義對象。
JavaScript對象
JavaScript提供多個內建對象，比如String、Date、Array等等，對象只是帶有屬性和方法的特殊數據類型
訪問對象的屬性
對象名稱.對象內部的方法屬性()；
訪問對象的方法
對象名稱.對象內部的方法名稱()；
創建JavaScript對象
通過JavaScript，您能夠自定義創建自己的對象
創建對象有兩種不同的方法
1.定義并創建對象實例
2.使用函數來定義對象，然后創建新的對象實例
使用對象構造器創建對象
案例：function Func(){}
創建JavaScript對象實例
var f = new Func();
JavaScript類
JavaScript是面向對象的語言，但JavaScript使用類
在JavaScript中，不會創建類，也不會通過類創建對象，就像在其它編程語言中一樣，JavaScript基于prototype，而不是基于類的
for in循環:
for( var i in is){}
JavaScript數字
JavaScript數字可以使用小數點也可以不使用小數點來書寫
所有數字均為64位
JavaScript不是類型語言，與許多其它編程語言不同，JavaScript不定義不同類型的數字，比如：整數、短、長、浮點數等等。JavaScript中的所有數字都存儲為1-的64位，浮點數
精度
整數（不使用小數點或指數計數法）最多15位
八進制和十六進制
如果前綴為0，則JavaScript會把數值常量解釋為八進制數，如果前綴為“0”或“x”則解釋為十六進制數
數字屬性方法
Max Value
Min Value
Negative Infinitive
Positive Infinitive
NaN
Prototype
Constructor
數字方法
ToExponential
toFixed
toPrecision
toString
ValueOf
JavaScript字符串對象
String對象用于處理已有的字符塊
（1）length：計算字符串長度
（2）添加字符樣式
(big,small,blink,bold,italics,fixed,strike,fontcolor,fontsize,toLowerCase,toUpperCase,tosub,tosup,link)
（3）indexOf:獲取字符串的選定字符
（4）match方法：獲取字符串的特定字符
（5）replace方法：獲取并覆蓋選定字符
JavaScript Date日期對象
（1）document.write(Date());返回當日的日期和時間
（2）getTime：獲取并返回毫秒單位
（3）setFullYear：獲取并返回年月日單位
（4）toUTCString：獲取年月日小時分鐘秒單位
（5）getDay：獲取日
（6）getHour，getMinute,getSecond:顯示一個鐘表
JavaScript數組對象
（1）創建對象：var a = new Array();
（2）For...In的聲明：for(var i in a){}
（3）合并兩個數組concat:
var a = Array();
var b = Array();
var c = a.Concat(b);
（4）用數組的元素組成字符串Join
var a = Array();
a.Join();
（5）文本數組排序sort
var a = Array();
a.Sort();
（6）數字數組排序Sort
var a = Array();
a.Sort();
JavaScript Boolean（邏輯）對象
Boolean類型轉換，如果進行轉換的變量的值是0或null或undefined或空字符串，則返回false，其它返回true
JavaScript Math（算數）對象
Round方法 返回四舍五入后的值
Random方法 返回0~1之間的隨機數
Max方法 返回兩個值之間的最大值
Min方法 返回兩個值之間的最小值
E方法：常數
Pi方法：圓周率
Sqrt2方法：2的平方根
SqrT1_2方法：1/2的平方根
Ln2方法：2的自然對數
Ln10方法：10的自然對數
Log_2e方法：以2為底的e的對數
Log_10e方法：以10為底的e的對數
JavaScript正則表達式
JavaScript RegExp對象
什么是RegExp對象？
RegExp是正則表達式的縮寫，當您檢索某個文本的時候，可以使用一種模式來描述要檢索的內容，RegExp就是這種模式，簡單的模式可以是一個單獨的字符，更復雜的模式包括更多的字符，并可用于解析、格式檢查、替換等等
您可以規定字符串的檢索位置，以及要檢索的字符類型等等
RegExp對象的方法
Test()：檢索字符串中的指定值，返回true或false
Exec();
檢索字符串中的指定值，返回值=找到與其匹配的值，如無匹配則返回null
您可以向RegExp添加第二個參數，以設定檢索，例如，如果你需要的找到的某個字符的所有存在，則可使用“g”參數（“global”）
compile();改變RegExp檢索，既可以改變，也可以添加或刪除
JavaScript瀏覽器對象模型
瀏覽器對象模型BOM使JavaScript有能力與瀏覽器對話
瀏覽器對象模型BOM
瀏覽器對象模型Browser Object Model尚無正式標準
由于現代瀏覽器幾乎實現了JavaScript交互性方面的相同方法和屬性。
因此常被認為是BOM的方法和屬性
Window對象
所有瀏覽器都支持Window它表示瀏覽器窗口
所有JavaScript全局對象、函數以及變量均自動成為window對象的成員
全局變量是window變量的屬性
甚至HTML中的DOM也是window變量的屬性之一
Window對象的尺寸
有三種方法能夠確定瀏覽器窗口的尺寸，瀏覽器的視口，不包括工具欄和滾動條
對于Internet Exploter、Chorme、FireBox、Opera、以及Safari
Window.innerHeight瀏覽器內部高度
Window.innerWidth瀏覽器內部寬度
Internet Exploter 8、7、6、5：
document.documentElement.ClientHeight
document.documentElement.ClientWidth
document.body.ClientHeight
document.bodyClientWidth
Window其它方法
Window.open();打開窗口windowresizeto();調整窗口尺寸
window.close();關閉窗口windowmoveto();移動窗口
JavaScript Window Screen
Window.screen對象包含用戶屏幕的信息
Window.screen對象在編寫可以不實用window這個前綴
screen.availWidth();可用的屏幕寬度
screen.availHeight();可用的屏幕高度
JavaScript Window Location
Window Location獲取當前頁面的地址，并瀏覽器重定向到該頁面
Window Loation
Window.location對象在編寫時可以不實用wndow這個前綴
案例：
location.hostname返回web主機的域名
location.pathname返回當前頁面的路徑和文件名
localtion.port返回web主機的端口
location.ptotocol返回所使用的web協議
Window Location Href
location.href屬性返回當前頁面的URL
Window Location Pathname返回當前URL的路徑名
Window Location Assign方法加載新的文檔
JavaScript Window History
Windows History
Window.history對象在編寫時可不使用window這個前綴
為了保護用戶隱私，對JavaScript訪問該對象的方法做出了限制
History.back()與在瀏覽器點擊后退按鈕相同
History.forward()與在瀏覽器中點擊按鈕向前相同
Window History Back
History.back()方法加載歷史列表中的前一個URL
這與在瀏覽器中點擊后退按鈕是相同的
Window History Forward
History.forward()方法加載歷史列表中的下一個URL
這與在瀏覽器中點擊前進按鈕是相同的
JavaScript Window Navigatior
Window Navigator對象包含有關訪問者瀏覽器的信息
Window Navgator對象在編寫時可以不使用window這個前綴
JavaScript消息框
警告框：經常用于確保用戶可以得到某些信息，當警告框出現后，用戶需要點擊按鈕才能繼續進行操作
—alert()；
帶有拆行的警告框：
—alert(“\n”)；
確認框：確認可用于使用戶驗證或者接收某些信息，當確認框出現后，用戶需要點擊確定或者取消按鈕才能繼續進行操作，如果用戶點擊確認，那么返回值為true，如果用戶點擊取消，則返回false
—confirm()；
提示框：提示框經常用于提示用戶在進入頁面前輸入某個值，當提示框出現后，用戶需要輸入某個值，然后點擊確認或取消按鈕才能繼續操縱，如果用戶點擊確認，那么返回值為輸入的值，如果用戶點擊取消，則返回null
—prompt方法
JavaScript計時
JavaScript中的計時事件：
setTimeout未來的某時執行代碼：
setTimeout方法會返回某個值，在上面的語句中，值被儲存在一個變量中，如果你希望取消這個setTimeout，你可以使用這個變量名來指定它。
setTimeout的第一個參數是含有JavaScript語句的字符串。
無窮循環：在一個函數中調用setTimeout同時在函數外部聲明一個變量，在函數內部進行一次自增，在setTimeout后重復調用一次當前函數以保持循環
clearTimeout取消setTimeout：清除掉時間，把時間歸為0
JavaScript Cookie
利用用戶在提示框中輸入數據創建一個cookie，當用戶再次訪問頁面時，根據cookie中的信息發出歡迎信息
什么是Cookie？
Cookie是存儲于訪問者計算機中的變量，每當同一臺計算機通過瀏覽器請求某個頁面時，就會發送這個cookie，你可以使用JavaScript來創建和取回cookie的值
有關cookie的例子？
名字cookie
密碼cookie
日期cookie
創建和存儲cookie：
