一、 事件流
1. 事件流描述的是從頁面中接收事件的順序
2. 事件冒泡（event bubble）：事件從開始時由最具體的元素（就是巢狀最深的那個節點）開始，逐級向上傳播到較為不具體的節點（就是document）
點選這裡
/*如果點選了div元素，那麼這個click事件會按如下順序傳播
1. 2. 3. 4. document
click事件首先在div元素上發生，也就是我們點選的元素，然後body元素發生點選事件……一層一層往上冒
*/
3. 事件捕獲：不太具體的節點（document根節點）更早接收到事件，最具體的節點最後接收到事件，剛好與冒泡相反
4. dom事件流三階段：
1. 事件捕獲階段：首先發生，為截獲事件提供機會
2. 處於目標階段：事件在此觸發
3. 事件冒泡階段：在這個階段對事件作出相應
4. 跨瀏覽器的事件處理函式【可復用，最好手寫】：
var eventutil =else
if(element.attachevent)
else
}removehandler:
function
(element , type , handler)
else
if(element.detachevent)
else
}getevent:
function
(event),
gettarget:
function
(event),
preventdefault:
function
(event)
else
},stoppropagation:
function
(event)
else
}};
5. 事件處理程式：響應某個事件的處理函式就是事件處理函式
1. 常用的兩個方法：用於處理指定和刪除事件處理函式的操作方法：addeventlistener()/removeeventlistener()
2. 這兩個方法接受3個引數：（事件名，處理函式，[,布林值]）。布林值預設為false，表示在冒泡階段呼叫事件處理函式，true表示在捕獲階段呼叫事件處理函式
btn.addeventlistener('click' , function(){} , false
)
//可新增多個事件處理函式
//移除↓
btn.removeeventlistener('click' , handler [, false])//
移除的事件處理函式不能是匿名函式
6. 事件物件：在觸發dom的某個事件時，會產生乙個事件物件：event，這個物件包含著所有的事件資訊
1. currenttarget:繫結事件處理函式的那個目標。在事件處理程式內部，this始終等於currenttarget的值
2. target:事件被觸發的那個目標
3. type：事件的型別：是click，還是mouseover……當需要乙個函式處理多種事件時可以：
var handler = function(event)
break
;
case 'mouseover':
function
(){}
break
;
case 'mouseout':
function
(){}
break
; }}
btn.onclick =handler;
btn.mouseover =handler;
btn.mouseout = handler;
//為每個li元素都新增乙個事件處理函式，太麻煩。只需要給dom樹中盡量最高層新增事件處理函式
eventutil.addhandler(ul , 'click',handler);
function
handler(event);
break
;
case 'li2':
function
(){};
break
;
case 'li3':
function
(){};
break
; }
}------------------解析------------------
/*1. 用事件委託只為ul元素新增了乙個click事件，由於所有的li元素都是ul的子節點，在li上的事件會往上冒泡，最終會冒到ul上，觸發在ul上繫結的事件處理函式。
2. 因為只為乙個dom元素，新增了乙個事件處理函式，占用記憶體更小，速度更快
3. 如果可行的話，可以考慮為document新增乙個事件處理函式，優點如下：
1. document物件訪問很快，可以在頁面生命週期的任何時間為它新增事件處理函式
2. 在頁面中設定事件處理函式所需的時間更少，對dom的引用更少
3. 最適合採用的事件包括：click、mousedown/up、keydown/up/press
*/
JS高階程式設計學習筆記之JS事件（1）
事件流 冒泡定義 事件開始時由最具體的元素接收，然後逐級上傳到較為不具體的節點。ie9 ff chrome safari會將事件一直冒泡到window物件。ie5.5及其以下會跳過元素，直接從body跳到document 若發生事件的節點元素並沒有繫結該事件，則這個動作會向上冒泡，直到被執行，一直冒...
JS高階 封裝註冊事件
相容性問題 1 ele.on事件型別 function 乙個元素ele註冊一種事件多次，會被替換成最後乙個，所以有侷限性 2 addeventlistener 事件型別,事件處理函式,usecapture 第三個引數預設是false，冒泡階段執行 3 attachevent 事件型別，事件處理函式 ...
js高階程式設計之跨瀏覽器事件處理
事件 var eventutil else if element.attachevent else 獲取dom event物件或者ie event物件 getevent function event 獲取執行事件物件 gettarget function event 阻止事件預設行為 prevent...