在各種浏覽器中存在四種事件模型：原始事件模型、標准事件模型、IE事件模型，還有一種Netscape4事件模型，下面具體介紹一下。
1、目前共存在四種事件處理模型分別是：原始事件模型、標准事件模型、IE事件模型，還有一種Netscape4事件模型，但基本可忽略
2、事件處理模型又可以分為基本事件處理和高級事件處理兩種，原始事件模型屬於基本事件處理，標准事件模型和IE事件模型屬於高級事件處理
一、基本事件處理：
基本事件處理主要是指原始事件模型實現的事件處理。其主要分為以下兩種：
（1）、作為HTML標簽性質的事件處理，比如 <div onmouseover=”var a=1; alert();”>……</div> //在這裡，onmouseover只是一個代表，還包含其他很多事件
在這種方式中，賦給onmouseover等事件處理函數的是JS代碼串，系統會把這些代碼串自動包裝在一個匿名函數中。其中可以有this關鍵字，它指向的是這個標簽元素，也可以有event關鍵字，它表示的是事件發生時的事件對象（用在標准浏覽器中）。如<div onmouseover=”f(this,event);”>……</div>
其實我們可以把onmouseover等看成是一個函數，在沒給它賦值前，它就是一個空函數。給它賦了js代碼後，就相當於往空函數裡添加了代碼。因為onmouseover等其實是一個函數，所以我們可以顯示的調用它，例如 element.onmouseover(),但這樣並不會引起mouseover事件的真正發生。
可以給事件函數（即onmoouseover等）返回false來舉止默認動作的發生。
函數是運行在定義它的作用域中，因此如果給事件處理函數賦值js代碼，就相當於是在這個HTML標簽環境中定義了一個函數，這種環境比較特殊，它的高一級的作用域並不是window全局對象環境，在這兩者之間還相隔這至少一種作用域環境。而在<script>中定義的函數，它的高一級作用域環境就是window(當然嵌套函數又要另當別論)。所以，在HTML標簽中，最好把代碼放在一個在<script>中定義的函數裡，然後再把這個函數調用賦給事件函數,即<div onmouseover=“function();”>……</div>
(2)、作為javascript屬性的事件處理 比如element.onmouseover=function(){……}
注意在這種方式，不能再給事件處理函數賦值js代碼串了，而是直接把函數（不是函數調用）賦給它，或是賦一個匿名函數，如 element.onmouseover=function(){……} 或 element.onmouseover=f； f為一個函數，在這裡不能加上括號
基本事件處理也會以冒泡的形式向上傳播
二、高級事件處理：
高級事件處理只要是指標准事件模型和IE事件模型實現的事件處理。
【概念理解】 事件的傳播可分兩種：一種是捕獲傳播，一種是冒泡傳播。
捕獲傳播：即事件從外傳到裡，每一級都發生了該事件
冒泡傳播；即事件從裡傳到外，每一級都發生了該事件，並不是所有的事件都會冒泡
（1）標准事件模型
標准事件模型既能發生冒泡傳播也能發生捕獲傳播。
【 事件注冊函數】
addEventListener() 該方法為特定元素注冊事件處理程序，有三個參數，第一個參數是事件名，注意沒有前綴on，第二個是處理函數（當然也可以是匿名函數），事件發生時，系統會自動給該函數的第一個參數傳入一個Event對象。最後一個參數是布爾值，如果為true,則只用於事件捕獲傳播階段，如果為false則只用於事件冒泡傳播階段，一般我們把它設為false
例如：element.addEventListener(“click”,f,false) //其中f為一個函數
f函數可以這樣定義：function f(e){……} //其中的參數在事件發生時就代表Event對象
高級事件處理的一大優勢是可以給同一個元素注冊多個事件處理函數，這些事件函數執行的順序並不能確定，但一般來說是按注冊的先後順序來執行，如果注冊了重復的事件函數，則只有第一個會生效。
removeEventListener() 該方法用來解除事件注冊，它的三個參數與addEventListener() 相同
（2）IE事件模型
IE事件模型只支持事件冒泡傳播
【 事件注冊函數】
attacthEvent() 該方法只有2個參數，一個為事件名，注意有前綴on，第二個為事件處理函數。例如 element.attachEvent(“onclick”,f)
IE事件模型的Event對象並不是作為事件發生時做為參數傳入事件處理函數的，IE的Event對象是一個window的全局對象，只有在事件發生時才可以訪問。
所以f函數可以這樣定義： function f(){var e=window.event;……} //其中e就取得了Event對象
detachEvent() 該方法用來取消事件注冊，參數與attacthEvent() 相同
addEventListener() 與attacthEvent() 的一個重要差別是attacthEvent()注冊的事件處理函數中的this關鍵字永遠是指向window對象的，而addEventListener() 注冊的事件處理函數中的this指向的是發生了事件的元素
（3）、IE與標准事件模型的Event對象比較
IE 事件對象
IE事件對象
標准事件對象
標准事件對象
altKey
true表示按下了ALT鍵，false表示沒有
altKey
true表示按下了ALT鍵。false表示沒有
ctrlKey
true表示按下了CTRL鍵，false表示沒有
ctrlKey
true表示按下了CTRL鍵，false表示沒有
shiftKey
true表示按下了SHIFT鍵，false表示沒有
shiftKey
true表示按下了SHIFT鍵，false表示沒有
button
鼠標事件。0表示沒有按下鼠標鍵，1為按下左鍵，2為按下右鍵，4為中間鍵，3為同時按下左右鍵，5為按下左鍵和中鍵，6為按下右鍵和中鍵，7為按下左鍵、中鍵、右鍵button
0為左鍵，1為中鍵，2為右鍵clientX
事件發生時，鼠標在浏覽器窗口（不包含工具欄、滾動條等）的X坐標clientX
事件發生時，鼠標在浏覽器窗口（不包含工具欄、滾動條等）的X坐標clientY
同上
clientY
同上
screenX
事件發生時，鼠標在整個屏幕上的X坐標
screenX
事件發生時，鼠標在整個屏幕上的X坐標
screenY
同上
screenY
同上
type
事件的名稱（如click)
type
事件的名稱(如click)
srcElement
引起事件的元素
target
引起事件的元素
keyCode
對於keypress事件，表示按鈕的unicode字符，對於keydown和keyup事件則表示按鈕的數字代碼charCode
表示按鍵的Unicode字符
keyCode
表示按鍵的數字代碼
cancelBubble
值為true時將阻止事件繼續向上冒泡
stopPropagation
可以調用這個方法來阻止事件繼續向上冒泡
cancelBubble
true表示事件冒泡已被取消，false表示沒有
returnValue
值為false時將會阻止事件的默認行為
preventDefault()
調用該方法可以阻止事件的默認行為
offsetX
獲取事件發生時鼠標相對於引起事件的元素的X坐標，即以引起事件的元素的本身（不用計算padding和margin)的左上角為原點layerX
當引發事件的元素沒有動態定位時，返回鼠標相對於引發事件的元素的最近的一個設置了動態定位的父元素裡的X坐標，以其父元素的邊框的左上角為原點。x
獲取鼠標相對於引發事件的元素的最近一個設置了動態定位的父元素的X坐標，以該父元素的邊框i的坐上角為原點以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持。