跨浏览的DOM节点事件监听器

如果我们要让某个DOM节点监听事件，最简单的方法就是使用 on+xxx 方法，但是如下时,后面的事件会把前面的事件覆盖掉，只会弹出 2 。

var div=document.getElementById('div');
div.onclick = function(){
    alert(1);
}
div.onclick = function(){
    alert(2);
}

我们可以使用以下方法来解决这个问题。

//绑定事件监听器
function addEventHandler(target,type,func){
    if(target.addEventListener){target.addEventListener(type,func,false);}  //非IE
    else if(target.attachEvent){target.attachEvent("on"+type,func);}  //IE
         else {target["on"+type]=func;}
}
//解除事件监听器的绑定
function removeEventHandler(target,type,func){
    if(target.removeEventListener){target.removeEventListener(type,func,false);}  //非IE
    else if(target.detachEvent){target.detachEvent("on"+type,func);}  //IE
         else delete target["on"+type];
}

我们像下面这样来使用这些方法：

var divs=document.getElementById("all");
addEventHandler(divs,"click",test1);
addEventHandler(divs,"click",test2);
addEventHandler(divs,"click",test3);
//removeEventHandler(divs,"click",test1);

 function test1(){
    alert(1);
 }
  function test2(){
    alert(2);
 }
  function test3(){
    alert(3);
 }