addEventListener 和 attachEvent 区别

1.添加多个事件处理程序执行的顺序不同

addEventListener： 
var btn=document.getElementById("myBtn");  
btn.addEventListener("click",function(){  
    alert(1);     
    },false);  
  
btn.addEventListener("click",function(){  
      alert(2);     
    },false); 

//执行结果 1 ，2

attachEvent： 
var btn=document.getElementById("myBtn");  
 btn.attachEvent("onclick",function(){  
     alert(1);     
   });  
 btn.attachEvent("onclick",function(){  
     alert(2);     
   });  

//执行结果 2 ，1

1. 事件处理程序的作用域不同

addEventListener： 
var btn=document.getElementById("myBtn");  
btn.addEventListener("click",function(){  
    console.log(this.id);    // myBtn   
    },false);

attachEvent： 
var btn=document.getElementById("myBtn");  
btn.attachEvent("onclick",function(){  
  alert(this===window);    // true   
  });

1. 移除绑定事件 removeEventListener() 和 detachEvent()

移除 addEventListener 事件：
element.removeEventListene(event, function, useCapture)
event: 事件名，注意不使用“on”前缀，如 click
function: 指定事件触发时执行的函数
useCapture: 指定事件是否在捕获或冒泡阶段执行
true: 在捕获阶段执行
false: 在冒泡阶段进行，默认值为false
如果添加时用的捕获阶段，那么在移除时也要用捕获阶段，否则无法移除它们
如果是同一个元素同一个调用函数同一个useCapture值绑定多次，在移除时只需要执行一次移除

移除 attachEvent 事件：
element.detachEvent(event, function)
event: 事件名，注意要使用“on”前缀，如 onclick
function: 指定事件触发时执行的函数