编写一个通用的事件监听函数
# 问题: 编写一个通用的事件监听函数
function addEventListener(element, eventType, handler, isEventDelegation) {
if (isEventDelegation) {
if (element.addEventListener) {
element.addEventListener(eventType, handler, true);
} else if (element.attachEvent) {
element.attachEvent('on' + eventType, handler);
} else {
element['on' + eventType] = handler;
}
} else {
if (element.addEventListener) {
element.addEventListener(eventType, handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + eventType, handler);
} else {
element['on' + eventType] = handler;
}
}
}
使用方法:
element
是要监听事件的 HTML 元素。eventType
是要监听的事件类型,例如'click'
、'keydown'
等。handler
是事件触发时要执行的函数。isEventDelegation
是一个布尔值,表示是否使用事件代理。如果传入true
,则使用事件代理;如果传入false
或不传入该参数,默认不使用事件代理。
示例:
var parentElement = document.getElementById('parentElement');
var childElement = document.getElementById('childElement');
function handleClick() {
console.log('Button clicked');
}
// 使用事件代理
addEventListener(parentElement, 'click', handleClick, true);
// 不使用事件代理
addEventListener(childElement, 'click', handleClick);