IE和DOM事件流普通事件和绑定事件的区别

Posted 鱼樱、、

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了IE和DOM事件流普通事件和绑定事件的区别相关的知识,希望对你有一定的参考价值。

IE和DOM事件流的区别 
IE采用冒泡型事件 Netscape(网络信息浏览器)使用捕获型事件 DOM使用先捕获后冒泡型事件 
示例: 
<body> 
   <div> 
      <button>click</button> 
   </div> 
</body> 
冒泡型事件模型:button->div->body (IE事件流) 
捕获型事件模型:body->div->button (Netscape事件流) 
DOM事件模型:body->div->button->button->div->body (先捕获后冒泡) 
普通添加事件的方法:
var btn = document.getElementById("btn");
btn.onclick = function(){
    alert(1);
}
btn.onclick = function(){
    alert(2);
}
执行上面的代码只会alert 2 
事件绑定方式添加事件:
var btn = document.getElementById("btn");
btn.addEventListener("click",function(){
    alert(1);
},false);
btn.addEventListener("click",function(){
    alert(2);
},false);
执行上面的代码会先alert 1再执行alert 2
普通添加事件的方法不支持添加多个事件,最下面的事件会覆盖上面的,而事件绑定(addEventListener)方式添加事件可以添加多个!!!

 

以上是关于IE和DOM事件流普通事件和绑定事件的区别的主要内容,如果未能解决你的问题,请参考以下文章

ie和dom事件流的区别

IE和DOM事件的区别

IE和DOM事件流的区别

JS面试题汇总

IE和DOM事件流的区别

vue的事件绑定