事件處理
客戶端js程序采用異步事件驅(qū)動編程模型。在這種情況下當(dāng)文檔，瀏覽器，元素發(fā)生一些事情的時候，會產(chǎn)生事件。

舉例 當(dāng)瀏覽器加載完文檔以后會觸發(fā)一個事件。該事件會有一個函數(shù)進(jìn)行處理，即回調(diào)函數(shù)

這種只不單單用于web界面，所有使用圖形界面的應(yīng)用程序都采用了這種方式。

有些事件和特定輸入設(shè)備直接相關(guān)。比如鼠標(biāo)和鍵盤。

touchmove 當(dāng)觸點在觸控平面上時發(fā)生該事件

click事件表示激活了鏈接的事件。通過鼠標(biāo)，按鈕或者移動設(shè)備上的觸摸觸發(fā)該事件

通常用于HTML表單元素，包括文本輸入域獲取鍵盤焦點的focus事件，提交按鈕將會觸發(fā)submit事件

不是由用戶活動由網(wǎng)絡(luò)或者瀏覽器活動觸發(fā)，表示某種生命周期或相關(guān)狀態(tài)的變化。

online 返回瀏覽器的聯(lián)網(wǎng)狀態(tài)

一些web api會有自己的事件類型
拖放的api dragstart 當(dāng)用戶拖動一個元素，或者選擇一個文本的時候觸發(fā)該事件

計時器在指定的時間后觸發(fā)該事件，錯誤處理程序，try catch 對應(yīng)于一個響應(yīng)，會有異步進(jìn)行拋出

當(dāng)提交表單和重置表單時會觸發(fā)submit和reset事件，當(dāng)用戶和類按鈕（包括單選和復(fù)選）交互的時，將會發(fā)生click事件，當(dāng)用戶輸入文字，選擇選項或選擇復(fù)選框改變相應(yīng)的表單元素的狀態(tài)時，將會觸發(fā)change事件，通過鍵盤改變焦點的表單元素在得到和失去焦點時將會觸發(fā)focus和blur事件。
通過事件處理程序能取消submit和reset事件的默認(rèn)操作。某些click事件也是如此，focus和clur事件不會冒泡，但其他所有表單事件都可以。
無論用戶何時輸入文字，都會觸發(fā)input事件。

window事件是指事件的發(fā)生與瀏覽器窗口本身而非窗口中顯示的任何特定文檔內(nèi)容相關(guān)。

load事件與文檔和其所有外部資源（圖片）完全加載并顯示給用戶時將會觸發(fā)。

unload事件，當(dāng)用戶離開當(dāng)前文檔轉(zhuǎn)向其他文檔時將會觸發(fā)。
unload事件處理程序可以用于保存用戶的狀態(tài)，但其不能取消用戶轉(zhuǎn)向其他地方。

此事件將會詢問用戶是否確定離開當(dāng)前頁面。如果beforeunload的回調(diào)函數(shù)返回一個字符串，那么在新頁面加載之前，字符串將會出現(xiàn)在展示給用戶確認(rèn)的對話框上，這樣用戶將會有機會取消跳轉(zhuǎn)停留在當(dāng)前頁上

注意；該事件僅僅是在當(dāng)前頁面的跳轉(zhuǎn)更改等，轉(zhuǎn)換標(biāo)簽不會觸發(fā)該事件

此為一個window對象的屬性。在js出錯的時候?qū)|發(fā)其

像img元素這樣的替換元素也能為其注冊load和error事件處理程序。當(dāng)外部資源完全加載或發(fā)生阻塞加載錯誤時將會觸發(fā)該事件。某些瀏覽器也支持about事件，當(dāng)圖強因為用戶停止加載進(jìn)程而導(dǎo)致失敗的時候也會觸發(fā)該事件。
focus和blur事件也為window事件，當(dāng)瀏覽器窗口從操作系統(tǒng)中得到或失去鍵盤焦點的時候?qū)|發(fā)該事件
當(dāng)用戶調(diào)整瀏覽器窗口大小或滾動其會觸發(fā)resize和scroll事件，scroll事件也能在任何可以滾動的文檔元素上觸發(fā)，例如css的的overflow屬性也能觸發(fā)。

當(dāng)用戶在文檔上移動和單擊鼠標(biāo)時都會產(chǎn)生鼠標(biāo)事件。這些事件在鼠標(biāo)指針?biāo)鶎?yīng)的最深嵌套元素上觸發(fā)。但其會冒泡直到文檔的最頂層。
clientX和clientY屬性指定了鼠標(biāo)在窗口坐標(biāo)中的位置。button和which屬性指定了按下的鼠標(biāo)鍵是哪個。
當(dāng)鼠標(biāo)輔助鍵按下的時候，對應(yīng)的屬性為altkey和ctrlkey和metakey和shiftkey會設(shè)置為true，對于click事件，detail屬性指定了其是單擊，雙擊，還是三擊。
每當(dāng)用戶移動和拖動鼠標(biāo)時，會觸發(fā)mousemove事件，當(dāng)用戶按下或釋放鼠標(biāo)按鍵的時候觸發(fā)mousedown和mouseup事件。
在mousedown和mouseup事件隊列之后，瀏覽器也會觸發(fā)click事件，如果用戶在很短的時間內(nèi)單擊兩次鼠標(biāo)，則第二個事件為dblclic事件，當(dāng)單擊鼠標(biāo)右鍵時，瀏覽器會顯示上下文菜單，在顯示菜單之前，也會觸發(fā)contextmenu事件，如果取消這個事件將會阻止菜單的顯示，該事件為獲得鼠標(biāo)右擊通知的最簡單方法。
當(dāng)用戶移動鼠標(biāo)指針從而使它懸停到新元素上時，瀏覽器就會在該元素上觸發(fā)mouseover事件，當(dāng)鼠標(biāo)移動指針從而使它不在懸停在某個元素上時，瀏覽器會觸發(fā)mouseout事件，（該事件有relatedTarget屬性指明這個過程涉及的其他元素）
當(dāng)用戶滾動鼠標(biāo)的時候，瀏覽器觸發(fā)mousewheel事件，傳遞事件對象屬性指定輪子轉(zhuǎn)動的大小和方向。

當(dāng)鍵盤聚焦到web瀏覽器時，用戶每次按下或釋放鍵盤上的按鍵時都會產(chǎn)生事件，鍵盤快捷鍵葉同樣能被瀏覽器和操作系統(tǒng)吃掉，此時對js事件處理程序不可見，無論任何文檔元素獲取鍵盤焦點都會觸發(fā)鍵盤事件，并會冒泡到window對象，

用戶旋轉(zhuǎn)設(shè)備的時會產(chǎn)生orientationchange事件，有一個縮放和旋轉(zhuǎn)手勢，當(dāng)手勢開始時將會生成getsturestart事件，手勢結(jié)束時將會生成gestureend事件。在這兩個事件之間是跟蹤手勢過程的gesturechange事件隊列，將事件傳遞的事件對象屬性為scale和rotation

握緊手勢的scale值小于1.0
撐開手勢的scale的值大于1.0
rotation為事件開始時手指旋轉(zhuǎn)的角度。以度為單位正值表示順時針方向旋轉(zhuǎn)

當(dāng)手指觸摸屏幕的時候?qū)|發(fā)touchstart事件，當(dāng)手指移動時會觸發(fā)touchmove事件，當(dāng)手指離開屏幕時會觸發(fā)touchend事件，觸摸事件傳遞的事件對象有一個changedTouches屬性，該屬性為一個類數(shù)組對象，其每個元素都描述觸摸的位置。

當(dāng)設(shè)備允許用戶從豎屏旋轉(zhuǎn)到橫屏模式時會在window對象上觸發(fā)orientationchanged事件。該對象的orientation屬性能給出當(dāng)前方位，其值為0， 90， 180， 或 -90

給事件目標(biāo)對象或文檔元素設(shè)置屬性

將事件處理程序傳遞給對象或文檔元素的一個方法

事件處理程序?qū)傩缘拿钟蒾n后面跟著事件名組成。onclick，onchange，onload，onmouseover

onload 當(dāng)對象的資源被加載的時候，該對象的onload事件將會被觸發(fā)，然后將表單的提交的onsubmit事件和一個處理函數(shù)進(jìn)行綁定

onsubmit 在表單提交的時候，將會觸發(fā)該事件

下方栗子演示一個提交的時候表單驗證的過程
其中validate函數(shù)為一個自定義的表單驗證函數(shù)，其函數(shù)的參數(shù)this指向elt

window.onload = () => {
    // 查找一個
元素
    var elt = document.getElementById("shipping_address");
    // 注冊事件處理程序函數(shù)
    // 在表單提交之前調(diào)用該函數(shù)
    elt.onsubmit = () => { return validate(this); };
}

點擊這里

點擊按鈕會彈出一個對話框

為事件綁定一個處理的函數(shù)

上方會彈出兩個對話框，一個觸發(fā)了onclick事件，一個觸發(fā)了addEventListener注冊的click事件。
注冊的click處理的函數(shù)，將會按照注冊的順序依次不斷的調(diào)用。(可以注冊多個處理程序)。

document.removeEventListener("mousemove", handleMouseMove, true);

移出在mousemove上注冊的事件，處理函數(shù)為handLenMouseMove，在事件上直接注冊，沒有冒泡的過程。

this關(guān)鍵字指的是事件的目標(biāo)。

這是個坑的集散地，表單上有一個HTML事件處理程序想要引用window的location對象，必須使用window.location，不能使用location，因為該location為表單作用域鏈上的location

如果返回false則告訴瀏覽器不要執(zhí)行這個事件的默認(rèn)操作。

通過設(shè)置對象屬性，HTML屬性注冊的處理程序一直優(yōu)先調(diào)用
使用addEventList注冊的處理程序，按照DOM的順序進(jìn)行調(diào)用
使用attachEvent()注冊的事件按照隨機的順序調(diào)用

當(dāng)事件目標(biāo)為window對象或其他一些多帶帶對象，瀏覽器會簡單的調(diào)用對象上的處理程序響應(yīng)事件。

在調(diào)用目標(biāo)元素上注冊的事件處理函數(shù)的時候，該事件會冒泡到DOM樹的樹跟，調(diào)用目標(biāo)的父元素的事件處理程序，即可以在共同的祖先元素上注冊一個處理程序來處理所有的事件
例如：在form元素上注冊change事件處理程序取代在表單的每個元素上注冊change事件處理程序。
原因：冒泡

注意：load事件，（load當(dāng)資源加載完成以后，將會觸發(fā)load事件，不單單指整個文檔）其會在Document對象上停止冒泡不會傳播到window對象，只有整個文檔都加載完成的時候?qū)|發(fā)window對象的load事件

事件的第一階段 捕獲 發(fā)生在目標(biāo)處理程序調(diào)用程序之前 addEventener()把一個布爾值作為其第三個參數(shù)，如果為true那么事件處理程序被注冊為捕獲事件處理程序，會在事件傳播的第一個階段調(diào)用。事件傳播的捕獲階段像是反向的冒泡，,將會最先調(diào)用window對象的捕獲處理程序，然后將會調(diào)用document對象的捕獲處理程序，接著是body對象的捕獲處理程序，逐漸按照DOM樹往下，直到調(diào)用事件目標(biāo)的父元素的捕獲事件捕獲。

通過調(diào)用事件對象的preventDefault()方法取消事件的默認(rèn)操作。

web應(yīng)用需要web瀏覽器通知它們文檔加載完畢和為操作準(zhǔn)備就緒的時間。
當(dāng)文檔準(zhǔn)備就緒的時候調(diào)用函數(shù)

事件冒泡屬于微軟的，向上
事件傳播屬于網(wǎng)景瀏覽器（懷舊，一個時代，可惜已經(jīng)不存在了），正好相反。
后來w3c將這兩種給統(tǒng)一了，規(guī)定任何事件首先向下傳播直到遇到目標(biāo)元素，如果沒有遇到冒泡元素，將會不斷的向上冒泡進(jìn)行返回。