1.背景介绍
浏览器的事件发生顺序
浏览器的事件发生顺序分为事件冒泡与事件捕获，分别由微软和网景公司提出。
事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。也就是说，事件会从最内层的元素开始发生，一直向上传播，直到document对象。
因此在事件冒泡的概念下在p元素上发生click事件的顺序应该是p -> div -> body -> html -> document
事件捕获会从最外层开始发生，直到最具体的元素。
因此在事件捕获的概念下在p元素上发生click事件的顺序应该是document -> html -> body -> div -> p
网景 和 微软 曾经的战争还是比较火热的，当时， 网景主张捕获方式，微软主张冒泡方式。后来 w3c 采用折中的方式，平息了战火，制定了统一的标准——先捕获再冒泡。
默认行为
浏览器的一些默认的行为。例如：点击超链接跳转，点击右键会弹出菜单，滑动滚轮控制滚动条
2.知识剖析
如何切换事件冒泡与事件捕获
使用addEventListener方法，其第三个参数可选择事件的发生顺序
element.addEventListener(event, function, useCapture)
第三个参数默认值是false，表示在事件冒泡阶段调用事件处理函数;如果参数为true，则表示在事件捕获阶段调用处理函数。
3.常见问题
如何阻止事件冒泡和默认事件?
4.解决方案
阻止事件冒泡
DOM中提供stopPropagation()方法，但IE不支持，使用event对象在事件函数中调用就行.
IE中提供的是，cancelBubble属性，默认为false，当它设置为true时，就是阻止事件冒泡，也是用event对象在事件函数中调用.
jQuery中提供了stopPropagation()方法来停止事件冒泡，当需要时，只需用用event对象来调用就行，即event.stopPropagation();
阻止默认行为
DOM中提供preventDefault()方法来取消事件默认行为，但是只有当cancelable属性设置为true的事件，才可以使用preventDefault()来取消事件默认行为，使用event对象在事件函数中调用就行。
IE中提供的是returnValue属性，默认为true，当它设置为false时，就是取消事件默认行为，也是用event对象在事件函数中调用。
jQuery中提供了preventDefault()方法来阻止元素的默认行为，只需要用event对象来调用就好，即event.preventDefault()
对于a链接，可以使用javascript伪协议来阻止默认行为
5.编码实战
6.扩展思考
冒泡和捕获同时存在时事件的触发顺序？
这里记被点击的DOM节点为target节点
1.对于非target节点则先执行捕获在执行冒泡
2.对于target节点则是先执行先注册的事件，无论冒泡还是捕获
7.参考文献
<a href="https://segmentfault.com/a/1190000004484445">JS中的事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE</a>
<a href="https://segmentfault.com/a/1190000005654451">JS中事件冒泡与捕获</a>
8.更多讨论
事件冒泡有什么作用
事件冒泡允许多个操作被集中处理（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子级元素上），它还可以让你在对象层的不同级别捕获事件。让不同的对象同时捕获同一事件，并调用自己的专属处理程序做自己的事情
