事件冒泡（IE事件流），事件捕获和DOM事件流

1 前言

《JS高级程序设计》第13章在讲述事件冒泡和事件捕获时没有提供实例，我想这部分内容如果有实例，会有助于读者理解。

2 事件冒泡和事件捕获

首先看一张图：描述了事件冒泡和事件捕获的流程。

首先声明，不同浏览器以及规范在事件流是否会触发顶层元素（document,html,body)有细微的差别，非常混乱。

IE事件流，即事件冒泡，是从达到触发条件的最小标签向上冒泡。比如上图中的img，即使绑定了click事件，如果不在其content(注意是content)内click,事件也无法触发。没有兼容性问题。

对于NetScape的事件流，即事件捕获，自顶向下直至满足条件（条件：点击区域在content内）的最小标签。I9+和其他现代浏览器支持。

接下来看例子，看代码：

<!--浏览器：Chrome版本 57.0.2987.133 (64-bit)-->
div id="highDiv" style="background-color: red" >
    <div id="lowDiv" style="margin-right: 800px">
    Click me
    </div>
</div>

document.getElementById('lowDiv').addEventListener('click',