新增事件及Event物件的相容寫法

2021-09-20 08:02:48 字數 1328 閱讀 4945

一、事件流

事件流描述的是從頁面中接受事件的順序。

ie的事件流是事件冒泡流,而netscape的事件流是事件捕獲流

1、事件冒泡

事件冒泡,即事件最開始由最具體的元素(文件中巢狀層次最深的那個節點)接收,然後逐級向上轉播至最不具體的節點(文件)。

2、事件捕獲

事件捕獲的思想是不太具體的節點應該更早接收到事件,而最具體的節點最後接收到事件。

二、事件處理程式

1、html事件處理程式

2、dom0級事件處理程式

3、dom2級事件處理程式

dom2級事件定義了兩個方法:用於處理指定和刪除事件處理程式的操作:addeventlistener()和removeeventlistener()。它們都接收三個引數:要處理的事件名、作為事件處理程式的函式和乙個布林值。

4、ie事件處理程式

attachevent()新增事件

detachevent()刪除事件

這兩個方法接收相同的兩個引數:事件處理程式名稱與事件處理函式

5、跨瀏覽器的事件處理程式

三、事件物件

事件物件event

1、dom中的事件物件

(1)、type:獲取事件型別

(2)、target:事件目標

(3)、stoppropagation() 阻止事件冒泡

(4)、preventdefault() 阻止事件的預設行為

2、ie中的事件物件

(1)、type:獲取事件型別

(2)、srcelement:事件目標

(3)、cancelbubble=true阻止事件冒泡

(4)、returnvalue=false阻止事件的預設行為

var eventutil=else if(element.attachevent)else

},// 刪除相容控制代碼

removehandler:function(element,type,handler)else if(element.detachevent)else

},// 獲取相容事件物件

getevent:function(event),

// 獲取相容的事件型別

gettype:function(event),

// 獲取相容事件源,既觸發事件的元素(事件的目標節點)

getelement:function(event),

// 取消相容預設事件

preventdefault:function(event)else

},// 防止相容冒泡

stoppropagation:function(event)else }

}

事件物件event

1.e.client 相對於當前頁面 視窗,不是這個元素 可視區域的左頂點 document.onmousemove function e 2.e.screen 相對於計算機螢幕的左頂點 document.body.onclick function e 3.offset 事件觸發時滑鼠距離該元素左邊...

事件物件(event)

再觸發dom上的某個事件時,會產生乙個事件物件event,這個物件中包含著所有與事件有關的資訊。所有瀏覽器都支援event物件,但支援的方式不同。1.事件物件的獲取 event的獲取 event內容重要內容 2.screenx pagex和clientx的區別 3.pagey和pagex的相容寫法 ...

事件Event物件

當事件發生時,會向呼叫函式傳遞乙個event物件,event 物件記錄當前事件發生時的環境資訊。乙個事件只能對應乙個event物件,並且event 物件是短暫存在的。dom中的 event 物件的使用方法 1 在html 標記中,通過事件來呼叫函式,向函式傳遞乙個 event 引數,該引數就是乙個 ...