事件处理程序

DOM2事件处理程序

addEventListener()接收三个参数：

        1、事件名

        2、事件处理函数

        3、布尔值（true表示在捕获阶段，false表示在冒泡阶段）

添加的事件处理程序只能使用removeEventListener()删除，且必须是同一个事件处理函数

IE事件处理程序

attachEvent() 与addEventListerner接收的参数一样，区别是addachEvent()的第一个参数是"onclick",而不是DOM的addEventListener()方法的"click"

删除使用detachEvent()

跨浏览器事件处理程序

addHandler()接收3个参数：

1、目标元素

2、事件名

3、时间处理函数

定义EventUtil对象

var EventUtil = {
    addHandler: function(element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    removeHandler: function(element, type, handler) {
        if (element.removeEventListener) {
            element.removeEventListener(type, handler, false);
        } else if (element.detachEvent) {
            element.detachEvent("on" + type, handler);
        } else {
            element["on" + type] = null;
        }
    }
};

        可以像下面这样使用EventUtil对象

let btn = document.getElementById("myBtn")
let handler = function() {
    console.log("Clicked");
};
EventUtil.addHandler(btn, "click", handler);
// 其他代码
EventUtil.removeHandler(btn, "click", handler);

标签：EventUtil,element,handler,处理程序,事件,addEventListener,type
来源： https://blog.csdn.net/qq_41369132/article/details/120477962