addEventListener()和attachEvent()跨浏览器的兼容性处理 — 第13.2.5节

来源：互联网发布：电脑屏幕录像软件编辑：程序博客网时间：2024/06/05 20:09

为了保证处理事件能在大多数浏览器下一致的运行，只需关注冒泡阶段。第一个要创建的方法是addHandler()，它的职责是视情况分别使用DOM0级方法、DOM2级方法或IE方法来添加事件。第二个方法是removeHandler()方法，用于移除添加的事件。EventUtil创建方法和用法如下：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title></head><body>    <div id="btn">你可以改变世界！</div></body><script type="text/javascript">    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;            }        }    }    var btn = document.getElementById('btn');    var handler = function(){        console.log('这是JavaScript高程第354页');    }    EventUtil.addHandler(btn,'click',handler);</script></html>

以上封装可以实现任何浏览器的绑定事件，敲一遍你就会了！

1 0