普通绑定事件和用 addEventListener 添加事件有什么区别

最新推荐文章于 2024-08-04 08:34:59 发布

weixin_42937047

最新推荐文章于 2024-08-04 08:34:59 发布

阅读量740

点赞数

分类专栏：原生js 文章标签：绑定事件

本文链接：https://blog.csdn.net/weixin_42937047/article/details/82180594

版权

原生js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一、onclick 添加事件不能绑定多个事件，后面绑定的会覆盖前面的。

box.onclick=function(){
alert(1);
}
//只会执行最后一个事件
box.onclick=function(){
alert(2);
}

二、addEventListener 能添加多个事件绑定，按顺序执行。
element.addEventListener(event,fn,useCaption );
参数说明：event比如 click mouseenter mouseleave
fn 回调函数
useCaption 用于描述是冒泡还是捕获。默认值是false，即冒泡传递。
当值为true，就是捕获传递。

box.addEventListener('click',function add1(){
   alert(1);
},false)
box.addEventListener('click',function add1(){
   alert(2);
},false)

三、普通方式绑定事件后，不可以取消。addEventListener绑定后则可以用 removeEvenListener 取消。
四、IE8及更早版本和Opear 7.0及更早版本不支持addEventListener()和removeEventListener()，需用attachEvent()和detchEvent()。