文章目录
什么是dom事件流
dom事件流的三个阶段
冒泡阶段处理程序
捕获阶段处理程序
如何阻止事件捕获/冒泡
0级，2级事件什么意思
目标阶段
事件流的根节点？
什么是dom事件流
DOM(文档对象模型)结构是一个树型结构，当一个HTML元素产生一个事件时，该事件会在元素节点与根结点之间的路径传播，路径所经过的结点都会收到该事件，这个传播过程可称为DOM事件流。
dom事件流的三个阶段
w3c规范规定有三个阶段：捕获阶段->目标阶段->冒泡阶段
但是js只能在捕获/冒泡中的一个阶段处理程序。
冒泡阶段处理程序
1）dom0级事件： on+事件名
2）IE8以及以下：attachEvent
3) dom2级事件：addEventListener, 第三个参数为false(默认false)
捕获阶段处理程序
1）dom2级事件：addEventListener, 第三个参数为true(默认false)
如何阻止事件捕获/冒泡
e.stopPropagation() 既可以阻止冒泡也可以阻止捕获
IE低版本：e.cancelBubble()
e.storpImmediatePropagation() 既可以阻止冒泡也可以阻止捕获
区别：storpImmediatePropagation() 会阻止该元素的其他事件，而stopPropagation不影响该元素的其他事件。
0级，2级事件什么意思
代表dom标准迭代版本，类比es5,es6
目标阶段
目标阶段，事件发生的顺序，只和书写顺序有关；storpImmediatePropagation会阻止目标阶段的其他事件发生；也会阻止事件继续传播（冒泡/捕获）
事件流的根节点？
window
捕获阶段的节点顺序： window->document->html->body->自定义元素节点
标签：DOM,捕获,dom,阻止,阶段,事件,冒泡 来源： https://www.cnblogs.com/wgqy/p/16326361.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。