定義
DOM事件被髮送用於通知代碼相關的事情已經發生了。每一個事件都是繼承自Event
類的對象,能夠包括自定義的成員屬性及函數用於獲取事件發生時相關的更多信息。事件能夠表示從基本用戶交互到渲染模型中發生的事件的自動通知的全部內容。
dom
綁定事件的方法
- ele.onxxx = function (event) {}; 兼容性很好,可是一個元素只能綁定一個處理程序 基本等同於寫在HTML行間上
- ele.addEventListener(type, fn, false); IE9如下不兼容,能夠爲一個事件綁定多個處理程序 當第三個參數設置爲true就在捕獲過程當中執行,反之就在冒泡過程當中執行處理函數。
- ele.attachEvent(‘on’ + type, fn); IE獨有,一個事件一樣能夠綁定多個處理程序
事件處理程序的運行環境
- ele.onxxx = function (event) {}; 程序this指向是dom元素自己
- obj.addEventListener(type, func, false); 程序this指向是dom元素自己
- obj.attachEvent(‘on’ + type, fn); 程序this指向window
封裝兼容性的 addEvent(elem, type, handle) 方法
function addEvent(elem, type, handle) { 函數
if(elem.addEventListener){ this
elem.addEventListener(type, handle, false); .net
} else if(elem.attachEvent) { code
elem.attachEvent('on'+ type, function(){ handle.call(elem); }) 對象
} else { blog
elem['on' + type] = handle; 繼承
}事件
}rem
解除事件處理程序
- ele.onclick = false/null;
- ele.removeEventListener(type, func, false);
- ele.detachEvent(‘on’ + type, func);
原文連接:https://blog.csdn.net/qq_37746973/article/details/81100051