关于element.addEventListener和element.attachEvent使用

一、示例：

if (element.addEventListener) { // Mozilla, Netscape, Firefox
      element.addEventListener('click', modifyText, false);

} else  if(element.attachEvent){ // IE
      element.attachEvent("onclick", modifyText);
}

 

function modifyText() {

       //To do ....

}

 

addEventListener() was introduced with the DOM 2 Events specification. Before then, event listeners were registered as follows:

1// Using a function reference—note lack of '()'

2el.onclick = modifyText;

3  

4// Using a function expression

5element.onclick = function(){

6                    ...statements...

7                  };

 

二、传参

If you want to pass parameters to the listener function, you have to use an anonymous function.

code：

element.addEventListener("click", function(){modifyText("four")}, false); 

 

三、多个function的执行顺序

   document.getElementById("element").onclick = function1;  
   document.getElementById("element").onclick = function2;  
   document.getElementById("element").onclick = function3;   
这样写,那么将会只有medhot3被执行  

 
IE写成这样：  
   var element= document.getElementById("element");  
   //element.attachEvent(event,function);   
   element.attachEvent("onclick",function1);   
   element.attachEvent("onclick",function2);   
   element.attachEvent("onclick",function3);   

执行顺序为function3->function2->function1

Mozilla系列，不支持该方法，要用到addEventListener  
   var element= document.getElementById("element");  
   //element.addEventListener(type,listener,useCapture);   
   element.addEventListener("click",function1,false);   
   element.addEventListener("click",function2,false);   
   element.addEventListener("click",function3,false);  
执行顺序为function1->function2->function3.