order的事件机制最近遇到一个问题，当一个dom元素绑定了一个事件回调，但是事件触发后事件回调没有执行，可能是什么原因？经过一番思考和对事件捕获冒泡机制的回顾，我总结出两个原因。在事件冒泡过程中，子元素阻止了事件冒泡。实在想不出还有什么其他原因导致事件向下捕获，所以希望有懂这篇博客的朋友指点一下迷宫事件传播机制。dom事件的事件源（即通过event.dom元素获取的事件源），我们称之为事件的目标元素，在一个事件触发前后，目标元素只会经历一个阶段——-目标阶段，目标元素及其祖先的所有父元素将经历两个阶段——捕获阶段和冒泡阶段。如果现在有这样一个节点树：document->ancestorn->...->father->targetelement当目标元素的事件被触发时，粗略描述每个元素所经历的过程是：文档捕获->祖先n捕获->...->父亲捕获->目标触发事件->父亲冒泡->...->祖先n冒泡->文档冒泡，即捕获阶段是从上到下bottom，同时冒泡的阶段是从下到上。如果我们使用element.addEventListener(callBack)给一个元素添加事件回调，这个回调会默认在目标阶段（如果是事件源）或者冒泡阶段（如果是事件源的祖先）触发.第一个原因已经很清楚了，只要在子元素的回调函数中使用stopPropagation就可以防止事件向上冒泡。如果我们进一步了解addEventListener方法，我们会发现除了回调函数之外，还可以传入一个options对象参数来配置如何处理事件。constoptions={capture:Boolean,//表示当事件的捕获阶段到达此元素时，将触发`listener`。once:Boolean,//表示`listener`添加后最多调用一次passive:Boolean//表示`listener`永远不会调用`preventDefault()`。}我们注意到这个对象有一个属性叫capture，怎么设置为true就是说当元素捕获到事件时会调用回调函数，而stopPropagation不仅可以防止事件冒泡，还可以防止事件发生不被向下捕获，所以第二个原因也可以做到，只要父元素设置事件捕获阶段触发的回调，阻止向下捕获事件即可。（我们常用的element.addEventListener(callBack,true)也是一种设置回调在捕获阶段执行的方法。）上面说了，事件源没有捕获阶段，也没有冒泡阶段，所以在捕获阶段设置事件源的监听是无效的，如果你希望事件源在监听事件的时候不触发元素绑定的其他回调，那么你可能需要使用stopImmediatePropagation。如果想深入了解事件捕获和冒泡的机制，可以看看这个实战演示。单击此处查看示例的源代码。最后，您不妨考虑另一个问题。如果在实际开发过程中发现某个元素的事件由于子元素的冒泡被阻塞导致监听回调无法触发。如何快速定位到有问题的子元素？
