js 添加事件 attachEvent 和 addEventListener 的區別

標籤：style   color   io   strong   sp   div   on   cti   ad   

 

1、addEventListener 
適用w3c標準方法addEventListener綁定事件，如下，事件的執行順序和綁定順序一致，執行順序為method1->method2->method3

 

1. //element.addEventListener(type,listener,useCapture);
2. btn1Obj.addEventListener("click",method1,false);
3. btn1Obj.addEventListener("click",method2,false);
4. btn1Obj.addEventListener("click",method3,false);

2、attachEvent 
在IE8及以下版本中，不支援addEventListener，只能用attachEvent綁定事件，執行順序是 method3->method2->method1

 

1. //object.attachEvent(event,function);
2. btn1Obj.attachEvent("onclick",method1);
3. btn1Obj.attachEvent("onclick",method2);
4. btn1Obj.attachEvent("onclick",method3);

3、屬性賦值法綁定事件 
適用該方法會使後綁定的方法覆蓋前面的方法，要想一次性綁定多個（一次性執行多個操作，可以再一個事件中調用多個方法）

 

1. obj.onclick=method1;
2. obj.onclick=method2;
3. obj.onclick=method3;

一次性綁定多個：

 

1. obj.onclick=function (){
2. method1();
3. method2();
4. method3();
5. }

js 添加事件 attachEvent 和 addEventListener 的區別