1-DOM事件
捕获、目标与冒泡
W3C的标准文档 DOM Level 2 Events Specification规定，浏览器同时支持监听函数的两种调用顺序：事件捕获和事件冒泡。
从外向内（从parent到child）查找、调用监听函数，并提供事件信息，叫做事件捕获(Capture)；
从内向外（从child到parent）查找、调用监听函数，并提供事件信息，叫做事件冒泡(Bubble)。
- 注意：
a. 如果没有监听函数，则跳过；
b. 由开发者自己选择，把监听函数放在捕获阶段还是冒泡阶段。
c. 事件流有三个阶段：捕获阶段(Capture Phase)、目标阶段(Target Phase)和冒泡阶段(Bubble Phase)，所以顺序是先捕获、后冒泡；哪里有监听，就调用并提供事件信息
API: addEventListener
button.addEvent Listener('click', fn, bool)
//如果bool不传，或为falsy值，就让fn走冒泡；如果bool为true，就让fn走捕获
特例
- 当只有一个div被监听的时候（不考虑父子同时被监听），fn分别在捕获和冒泡阶段监听click事件，此时用户点击的元素，就是开发者监听的——即
.target和.currentTarget是同一个元素； - 捕获不可以取消，但是一些冒泡可以通过
.stopPropagation()中断，一般用于封装某些独立的组件； - 还有一些事件不可取消冒泡，比如
scroll，具体还有哪些可以查MDN原文版(see if the event is cancelable)； - 除去 MDN 罗列的100+种浏览器自带事件外，还可以自定义事件。
2-事件委托
运用代码去委托一个元素，代劳开发者本人进行监听的手法，叫做事件委托。
事件委托有两个优点，一是通过节省监听数来节省内存，二是可以监听动态元素。
一个元素如果不存在，或是此刻不存在，那么通过监听祖先元素，可以达到监听该动态元素的目的。
监听祖先元素是一个自上而下的思想模式，也可以说是逐步设计完善的一种模式，它本质上是通过逆向分解系统，获得对子代的监听/系统的洞察力。子元素代表未来，有无限可能，我们无法在一开始真实预测未来的全部，但是可以通过监听祖先元素，掌控/监听未知。
