element.onclick = function(e){ // ... };
1. 傳統(tǒng)綁定的優(yōu)點
非常簡單和穩(wěn)定,可以確保它在你使用的不同瀏覽器中運作一致
處理事件時,this關(guān)鍵字引用的是當前元素,這很有幫組
2. 傳統(tǒng)綁定的缺點
傳統(tǒng)方法只會在事件冒泡中運行,而非捕獲和冒泡
一個元素一次只能綁定一個事件處理函數(shù)。新綁定的事件處理函數(shù)會覆蓋舊的事件處理函數(shù)
事件對象參數(shù)(e)僅非IE瀏覽器可用
W3C方式
element.addEventListener('click', function(e){ // ... }, false);
1. W3C綁定的優(yōu)點
該方法同時支持事件處理的捕獲和冒泡階段。事件階段取決于addEventListener最后的參數(shù)設(shè)置:false (冒泡) 或 true (捕獲)。
在事件處理函數(shù)內(nèi)部,this關(guān)鍵字引用當前元素。
事件對象總是可以通過處理函數(shù)的第一個參數(shù)(e)捕獲。
可以為同一個元素綁定你所希望的多個事件,同時并不會覆蓋先前綁定的事件
2. W3C綁定的缺點
IE不支持,你必須使用IE的attachEvent函數(shù)替代。
IE方式
element.attachEvent('onclick', function(){ // ... });
1. IE方式的優(yōu)點
可以為同一個元素綁定你所希望的多個事件,同時并不會覆蓋先前綁定的事件。
2. IE方式的缺點
IE僅支持事件捕獲的冒泡階段
事件監(jiān)聽函數(shù)內(nèi)的this關(guān)鍵字指向了window對象,而不是當前元素(IE的一個巨大缺點)
事件對象僅存在與window.event參數(shù)中
事件必須以ontype的形式命名,比如,onclick而非click
僅IE可用。你必須在非IE瀏覽器中使用W3C的addEventListener
Dean Edwards的方案(addEvent/removeEvent庫)
1. addEvent的優(yōu)點
可以在所有瀏覽器中工作,就算是更古老無任何支持的瀏覽器
this關(guān)鍵字可以在所有的綁定函數(shù)中使用,指向的是當前元素
中和了所有防止瀏覽器默認行為和阻止事件冒泡的各種瀏覽器特定函數(shù)
不管瀏覽器類型,事件對象總是作為第一個對象傳入
2. addEvent的缺點
僅工作在冒泡階段(因為它深入使用事件綁定的傳統(tǒng)方式)
Copyright ? 2019- 91gzw.com 版權(quán)所有 湘ICP備2023023988號-2
違法及侵權(quán)請聯(lián)系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com
本站由北京市萬商天勤律師事務(wù)所王興未律師提供法律服務(wù)