跨瀏覽器的事件處理程式

2021-07-31 23:56:08 字數 986 閱讀 5136

要保證事件處理的**在大多數瀏覽器下能夠一致的執行,只需關注冒泡階段即可。

第乙個要建立的方法是addhandler(),它的職責是視情況分別使用 dom0 級方法、dom2 級方法或 ie 方法來新增事件。這個方法屬於乙個叫做 eventutil 的物件,addhandler()接受三個引數:要操作的元素、事件名稱和事件處理程式函式。

addhandler()方法相對應的是removehandler(),他也接收相同的引數。這個方法的職責是移除之前新增的事件處理程式,無論該事件處理程式是採取什麼方式新增到元素中的,如果其他方法無效,預設採用 dom0 級方法。

var eventutil =  else

if ( element.attachevent ) else

},removehandler : function

( element, type, handler ) else

if ( element.detachevent ) else

}}//使用方法

var obtn = document.queryselector("#btn");

var handler = function

() eventutil.addhandler( obtn, "click", handler );

// eventutil.removehandler( obtn, "click", handler );

這兩個方法首先都會檢測傳入的元素中是否存在 dom2 級方法,如果存在該方法則使用該方法。

如果存在的是 ie 的方法,則使用第二種方案。注意,為了在 ie8 級更早的版本中執行,此時的事件型別必須加上「on」字首。

最後一種可能就是使用 dom0 級方法(在現代瀏覽器中應該不會執行這裡的**)。此時我們使用的是方括號語法來將屬性名指定為事件處理程式。

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

事件 事件是使用者或瀏覽器自身執行的某些動作,例如 click load mouseover 事件處理程式 用於響應某個事件的函式 在不同的瀏覽器,dom中,事件處理程式是響應某個事件的函式 dom0 中事件處理函式 event onclick function 刪除程式 event onclick...

跨瀏覽器新增事件處理程式

新增事件 element是要操作的元素,type是事件名稱,handler是事件處理程式函式 function addhandler element,type,handler else if element.attachevent else 移除事件 function removehandler e...

跨瀏覽器之事件處理程式

上次說到了js中事件處理程式在dom0級和dom2級和ie中是不同的,每個都有自己的新增和移除事件處理程式的形式。那要將這些差異進行統一化。避免這種差異。對於順序問題,我們應該要先將最經常使用的放在最上面把相容性最好的放在最下面,也就是實現向後相容。1 function addevent obj,t...