事件模型主要分為3種：原始事件模型、dom2事件模型、ie事件模型。
1.原始事件模型（dom0級）
這是一種被所有瀏覽器都支援的事件模型，對於原始事件而言，沒有事件流，事件一旦發生將馬上進行處理，有兩種方式可以實現原始事件：
（1）在html**中直接指定屬性值：
（2）在js**中為 document.getelementsbyid(「demo」).onclick = dosometing()
優點：所有瀏覽器都相容
缺點：1）邏輯與顯示沒有分離；2）相同事件的監聽函式只能繫結乙個，後繫結的會覆蓋掉前面的，如：a.onclick = func1; a.onclick = func2;將只會執行func2中的內容。3）無法通過事件的冒泡、委託等機制（後面會講到）完成更多事情。
因為這些缺點，雖然原始事件型別相容所有瀏覽器，但仍不推薦使用。
2.dom2事件模型
此模型是w3c制定的標準模型，現代瀏覽器（ie6~8除外）都已經遵循這個規範。w3c制定的事件模型中，一次事件的發生包含三個過程：
(1).事件捕獲階段，(2).事件目標階段，(3).事件冒泡階段。如下圖所示
事件捕獲：當某個元素觸發某個事件（如onclick），頂層物件document就會發出乙個事件流，隨著dom樹的節點向目標元素節點流去，直到到達事件真正發生的目標元素。在這個過程中，事件相應的監聽函式是不會被觸發的。
事件目標：當到達目標元素之後，執行目標元素該事件相應的處理函式。如果沒有繫結監聽函式，那就不執行。
事件冒泡：從目標元素開始，往頂層元素傳播。途中如果有節點繫結了相應的事件處理函式，這些函式都會被一次觸發。
所有的事件型別都會經歷事件捕獲但是只有部分事件會經歷事件冒泡階段,例如submit事件就不會被冒泡。
事件的傳播是可以阻止的：
• 在w3c中，使用stoppropagation（）方法
• 在ie下設定cancelbubble = true；
在捕獲的過程中stoppropagation（）；後，後面的冒泡過程就不會發生了。
標準的事件***該如何繫結：
addeventlistener(「eventtype」,「handler」,「true|false」);其中eventtype指事件型別，注意不要加『on』字首，與ie下不同。第二個引數是處理函式，第三個即用來指定是否在捕獲階段進行處理，一般設為false來與ie保持一致(預設設定)，除非你有特殊的邏輯需求。***的解除也類似：removeeven
3.ie事件模型
ie不把該物件傳入事件處理函式,由於在任意時刻只會存在乙個事件,所以ie把它作為全域性物件window的乙個屬性，為求證其真偽，使用ie8執行**alert(window.event)，結果彈出是null，說明該屬性已經定義，只是值為null（與undefined不同）。難道這個全域性物件的屬性是在監聽函式裡才加的？於是執行下面**：
window.onload = function ()
settimeout(function(),2000);
結果第一次彈出【object event】，兩秒後彈出依然是null。由此可見ie是將event物件在處理函式中設為window的屬性，一旦函式執行結束，便被置為null了。ie的事件模型只有兩步，先執行元素的監聽函式，然後事件沿著父節點一直冒泡到document。冒泡已經講解過了，這裡不重複。ie模型下的事件監聽方式也挺獨特，繫結監聽函式的方法是：attachevent( 「eventtype」,「handler」)，其中evettype為事件的型別，如onclick，注意要加』on』。解除事件***的方法是 detachevent(「eventtype」,「handler」 )
ie的事件模型已經可以解決原始模型的三個缺點，但其自己的缺點就是相容性，只有ie系列瀏覽器才可以這樣寫。
以上就是3種事件模型，在我們寫**的時候，為了相容ie，通常使用以下寫法：
var demo = document.getelementbyid(『demo』);
if(demo.attachevent)else{
demo.addeventlistener(『click』,func,false);
JS事件流模型
事件捕獲event capturing是一種從上而下的傳播方式，以click事件為例，其會從最外層根節向內傳播到達點選的節點，為從最外層節點逐漸向內傳播直到目標節點的方式。事件冒泡event bubbling是一種從下往上的傳播方式，同樣以click事件為例，事件最開始由點選的節點，然後逐漸向上傳播...
JS事件模型小結
三種事件模型 原始事件模型 dom0 dom2事件模型，ie事件模型 不同點 事件程式的註冊 給html元素所對應的js物件繫結事件 事件傳播的過程 事件模型的註冊 一 原始事件模型 沒有相容性問題 原始事件模型的特點 事件型別上面有on onclick 沒有事件的傳播 事件一旦發生就立刻呼叫事件控...
深入理解JS的事件繫結 事件流模型
一 js事件 一 js事件分類 1.滑鼠事件 click dbclick mouseover mouseout 2.html事件 onload onunload onsubmit onresize onchange onfoucs onscroll 3.鍵盤事件 keydown 鍵盤按下時觸發 ke...