如果我有一个嵌套在另一个元素中的元素 (html) 并且它们都附加了一个单击处理程序，则单击内部元素会执行其单击处理程序，然后冒泡到父元素并执行其单击处理程序。我就是这么理解的。
如果没有附加相同的事件，事件是否会在 DOM 树中冒泡？如果是这样，是否值得在每个处理程序的末尾放置一个 event.stopPropagation() 来阻止它并加快速度？
user76071
问问题
18822 次
2 回答
17
事件几乎总是冒泡，除非设置了 event.cancelBubble=true 或使用了 event.stopPropagation()。但是，只有当您的事件处理程序之一被触发时，您才会意识到这一点。
请参阅http://en.wikipedia.org/wiki/DOM_events以获取冒泡事件列表。（注：在HTML事件表中，cancelable是指event.preventDefault()或者return false取消默认动作的有效性，不是冒泡）
另请参阅http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow，特别是 1.2.1 基本流程以了解事件传播的捕获阶段和冒泡阶段。
编辑
http://mark-story.com/posts/view/speed-up-javascript-event-handling-with-event-delegation-and-bubbling表明通过停止传播可以提高性能，但不提供数据。
http://groups.google.com/group/Google-Web-Toolkit/browse_thread/thread/a9af0aa4216a8046建议浏览器应该针对冒泡行为进行优化，并表示应该没有显着的性能差异。再次没有数据。
http://developer.yahoo.com/performance/rules.html#events为提高事件处理性能提供了一种很好的技术，但没有直接谈论 stopPropagation 性能。
最终，您必须对差异进行分析，才能很好地了解您网站上的好处。
于 2009-10-05T23:48:54.803 回答
1
我想这种行为已经被浏览器很好地优化了，所以在停止传播时你将无法获得显着的性能提升（也许，对于非常非常复杂的嵌套 DOM 结构除外）。如果您担心性能并处理大量事件，您可能会对事件委托感兴趣。
此外，您应该记住您的代码应该保持可读性和自解释性。stopPropagation()是一种用于特定目的的方法，因此在每种方法中使用它可能会非常混乱。
于 2009-10-06T00:07:16.887 回答