js 3种绑定事件方式的异同

js 获取事件类型的三种方法 - 简书

如下代码中,第二个onclick事件会覆盖第一个事件,

<p id='oo'>ddddddddddddddddddddddddddddddd</p>
<script>
var x=document.getElementById("oo");
x.onclick=function(e){
    alert('clicked');
};//会被下面的onclick覆盖
x.onclick=function(e){
    e.target.style.color="pink"
}

</script>

如果采用addeventlistener就不会被覆盖

<p id='oo'>ddddddddddddddddddddddddddddddd</p>
<script>
var x=document.getElementById("oo");

x.addEventListener('click',function(e){
    alert('ckicked');
});

x.addEventListener('click',function(e){
    e.target.style.color="pink"
});

</script>

这也是需要addEventListener这个方法的原因之一!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容