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事件流、普通事件和绑定事件的区别的更多相关文章

  1. 对jquery新增加的class绑定事件 jquery 对相同class 绑定事件

    当页面加载时,就会注册所有的事件,后面通过jquery新增的内容(<div class="item"></div>),再对新增的添加事件$(".i ...

  2. 理解DOM事件流的三个阶段

    本文主要解决两个问题: 1.什么是事件流 2.DOM事件流的三个阶段 事件流之事件冒泡与事件捕获 在浏览器发展的过程中,开发团队遇到了一个问题.那就是页面中的哪一部分拥有特定的事件? 可以想象画在一张 ...

  3. [DOM Event Learning] Section 4 事件分发和DOM事件流

    [DOM Event Learning] Section 4 事件分发和DOM事件流 事件分发机制: event dispatch mechanism. 事件流(event flow)描述了事件对象在 ...

  4. js事件捕获，事件冒泡，事件委托以及DOM事件流

    一:DOM事件流: 事件流是从页面接收事件的顺序,DOM2级事件规定事件流包括三个阶段: ①事件捕获阶段:用意在于事件达到目标之前捕获它,在事件捕获阶段事件流模型:document→html→body ...

  5. 理解DOM中的事件流

    浏览器发展到第四代时(IE4和Netscape Communicator 4),浏览器团队遇到一个很有意思的问题:页面的哪一部分会拥有特定的事件?想象下在一张纸上有一组同心圆,如果你把手指放在圆心上, ...

  6. 关于DOM事件流、DOM0级事件与DOM2级事件

    一.DOM 事件模型 DOM 事件模型包括捕获和冒泡,捕获是从上往下到达目标元素,冒泡是从当前元素,也就是目标元素往上到 window 二.流 流的概念,在现今的 JavaScript 中随处可见.比 ...

  7. [已转移]JavaScript事件---DOM事件流

    该文章已转移到博客:https://cynthia0329.github.io/ 事件发生时会在元素节点与根节点之间按照特定的顺序传播,路径所经过的所有节点都会收到该事件 这个传播过程即DOM事件流. ...

  8. js：事件（注册、解绑、DOM事件流、事件对象、事件委托）

    1.注册事件 (1)传统方式注册事件 <body> <button id="b1">请点击</button> <script> va ...

  9. HTML 事件(三) 事件流与事件委托

    本篇主要介绍HTML DOM中的事件流和事件委托. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三) 事件流与事件委托 4 ...

  10. javaScript事件（一）事件流

    一.事件 事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都是事件的名字.事件是javaScript和DOM之间的桥梁.你若触发,我便执行——事件发生,调用它的处理函数 ...

随机推荐

  1. LEA指令与MOV指令的区别——发现一本汇编好书

    一.汇编语言中PTR的含义及作用mov ax,bx ;是把BX寄存器“里”的值赋予AX,由于二者都是word型,所以没有必要加“WORD”mov ax,word ptr [bx];是把内存地址等于“B ...

  2. Android系统input按键处理流程（从驱动到framework）【转】

    本文转载自:http://blog.csdn.net/jwq2011/article/details/51234811 (暂时列出提纲,后续添加具体内容) 涉及到的几个文件: 1.out/target ...

  3. shell网络管理

    背景知识 联网就是通过网络将主机进行互联并采用不同的规范配置网络上的节点.我们以 TCP/IP 作为网络栈,所有的操作都是基于它进行的.网络是计算机系统中重要的部分.连接在网络上的每个节点都分配了一个 ...

  4. java实现io读取数据

    ServletInputStream inputStream = request.getInputStream(); BufferedReader br = new BufferedReader(ne ...

  5. html5--项目实战-仿天猫（移动端页面）

    html5--项目实战-仿天猫(移动端页面) 总结: 1.标准搜索栏的做法:这里是弹性布局,放大镜和小话筒是background img 2.手机尾部导航做法:这是一个个 li 标签,每个li标签占% ...

  6. JAVA web简单的登录界面jsp实现

    此次试验所用到的软件是myeclipse10,tomcat7,Dreamweaver,sqlserver2008数据库.可以实现用户使用用户名和密码登录.如果登录成功,页面会显示登录成功,如果密码错误 ...

  7. C语言-1.static 和 extern使用,2.文件,3.数据块读写

    1.static 和 extern使用, 1)修饰局部变量 static修饰局部变量特点:延长局部变量的生命周期 ,static修饰的局部变量只会被执行一次 extern不能修饰局部变量 2)修饰全局 ...

  8. Pascal之计算小系统

    program Project16; {$APPTYPE CONSOLE} VAR n,i,k,score,b,a:integer; answer,c:real; ch:char; Begin rep ...

  9. SOLID总结（未完待续）

    SOLID原则是著名的面向对像设计五原则,之所以要引入这些原则,是为了给以防止代码腐化而进行的重构活动定下切实可行的目标. 随着系统开发的进行,产品代码不可避免地会不断腐化,就算在开发过程中很好地应用 ...

  10. 无线 WIFI 的13个信道频率范围（转载）

    转自:http://cnzhx.net/blog/13-channels-of-wifi/ 目前主流的无线WIFI网络设备不管是802.11b/g还是802.11b/g/n 一般都支持13个信道.它们 ...