JS之注册事件和删除事件的三种不同方式

原文链接：https://www.cnblogs.com/shanlu0000/p/11479710.html

<1>注册事件（绑定事件）

方法①：传统方式注册事件

divs[0].onclick=function(){
   alert("1");
}

方法②：事件侦听注册事件 addEventListener

divs[1].addEventListener('click' , funciton(){
   alert("2");
}) 
divs[1].addEventListener('click',function(){
  alert("22");
})

注意，里面的事件类型是字符串，必定加引号，而且不带 on

同一个元素，同一个事件，可以添加多个侦听器（事件处理程序，事件函数）

方法③： attachEvent 注册事件 （ie9以下才支持）

divs[2].attachEvent('onclick',function(){
     alert("3");
}）

 

<2>删除事件（解绑事件）

方法①：传统方式解绑事件

divs[0].onclick=function(){
  alert("1"）；
  divs[0].onclick=null;
}

方法②：removeEventListener 解绑事件

divs[0].addEventListener('click',fn);
function fn(){
   alert("1");
   divs[0].removeEventListener('click',fn);
}

注意，removeEventListener, 删除事件,必须指定解绑哪个事件函数，所以把事件函数单独写出来，里面的fn ,不需要调用加小括号

方法③：detachEvent 解绑事件

divs[2].attachEvent('onclick',fun);
function fun(){
  alert("3");
  divs[2].detach('onclick', fun);
}