function addEvent(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false) }else if(element.attacheEvent){ //attacheEvent element.attachEven('on'+type,function(){ handler.apply(element,arguments); // attachEvent方法中,修复this指针问题 }); }else{ element['on'+type]=handler; } }
每次调用 addEvent 函数的时候,它都要对浏览器所支持的能力进行检查,首先检查是否支持addEventListener 方法,如果不支持,再检查是否支持 attachEvent 方法,如果还不支持,就用 dom 0 级的方法添加事件。 这个过程,在 addEvent 函数每次调用的时候都要走一遍,其实,如果浏览器支持其中的一种方法,那么他就会一直支持了,就没有必要再进行其他分支的检测了, 也就是说,if 语句不必每次都执行,代码可以运行的更快一些。
function addEvent (element,type,handler) { if (element.addEventListener) { addEvent = function (element,type,handler) { element.addEventListener(type, handler, false); } } else if(element.attachEvent){ addEvent = function (element,type,handler) { element.attachEvent('on' + type, function(){ handler.apply(element,arguments); // attachEvent方法中,修复this指针问题 }); } } else{ addEvent = function (element,type,handler) { element['on' + type] = handler; } } return addEvent(element,type,handler); }
var addEvent = (function () { if (document.addEventListener) { return function (type, element, handler) { element.addEventListener(type, handler, false); } } else if (document.attachEvent) { return function (type, element, handler) { element.attachEvent('on' + type, function(){ handler.apply(element,arguments); // attachEvent方法中,修复this指针问题 }); } } else { return function (type, element, handler) { element['on' + type] = handler; } } })();