最近一段时间正在对JavaScript进行学习，知识太多，需要进行实际的使用和总结，国庆长假正好有时间，写了下面对JavaScript总结，可能对事件的理解还不够完善，希望读者多多指导，拍砖，我将不胜感激。好了直接如题吧。JavaScript中的事件流DOM2级事件规定事件流分为 ...
最近一段时间正在对JavaScript进行学习，知识太多，需要进行实际的使用和总结，国庆长假正好有时间，写了下面对JavaScript总结，可能对事件的理解还不够完善，希望读者多多指导，拍砖，我将不胜感激。好了直接如题吧。
JavaScript中的事件流
DOM2级事件规定事件流分为3个阶段：
第一阶段：事件捕获阶段，先由文档的根节点Window->Document->html->body…往事件触发对象，从外向内捕获事件对象。
第二阶段：目标阶段，到达目标事件位置，触发事件；
第三阶段：事件冒泡，再从目标事件位置往文档的根节点方向，反向冒泡。
事件捕获和事件冒泡的先后顺序如上图显示的步骤（1）、（2）、（3）。
在此简单的做一下上面的捕获和冒泡的实验：
环境就以常用的Chrome浏览器，代码如下：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Event</title> 5 </head> 6 <body> 7 <div id="btn-big-test"> div1 8 <br/> 9 <br/>10 <div id="btn-big-test2">div2</div>11 </div>12 </body>13 <script type="text/javascript">14 var el = document.getElementById('btn-big-test');15 var el2 = document.getElementById('btn-big-test2');16 el.addEventListener('click', function(event) {17 console.log("冒泡1>>" + Date.parse(new Date()));18 }, false);19 20 el.addEventListener('click', function() {21 console.log("捕获1>>" + Date.parse(new Date()));22 }, true);23 el2.addEventListener('click', function() {24 console.log("冒泡2>>" + Date.parse(new Date()));25 }, false);26 27 el2.addEventListener('click', function() {28 console.log("捕获2>>" + Date.parse(new Date()));29 }, true);
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com
原标题：JavaScript中的事件
关键词：JavaScript
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
