停止事件冒泡-提高性能？

Question

如果我不从事件回调中返回false，或不使用jQuery的e.stopPropagation功能，则该事件会使DOM冒泡。

[在大多数情况下，我不在乎事件是否冒泡。类似于此DOM结构示例：

​<div id="theDiv">
    <form id="theForm" >
        <input type="submit" value="submit"/> 
    </form>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

通常，我没有像这样的多个嵌套的提交回调：

$('#theDiv').submit(function() {
    alert('DIV!');
});
$('#theForm').submit(function(e) {
    alert('FORM!');
    e.preventDefault();
});​

Fiddle该演示显示submit事件冒泡到<div>！如果我停止传播或只是阻止默认设置，对我来说没有什么区别。

在那些情况下，如果停止传播，我将获得性能收益吗？

Answer 1

性能优势？是的，this performance test between jQuery live() and on()中概述了一些细微的好处。正如@Joseph还指出的那样，两者之间的区别是live一直传播到整个树，而live()仅转到最近的公共父级。

在那些测试中，显示出on()的性能最高可达on() 4倍。在实践中，这可能仍然不值得花些时间，但是我想，如果您具有非常深的html结构和大量事件触发器，则在停止传播方面的性能差异可能是值得的。

Answer 2

on()和live()之间的[here's a comparison，涉及冒泡以及jQuery替换on()的原因。 live()的问题在于事件已附加到文档，从而导致沿树漫长的路程以查找处理程序。使用live()可以执行的操作是，可以将处理程序附加到最近的公共父级上，从而避免在树中寻找处理程序时花费很长时间-这意味着性能更快。

但是我建议您自己进行基准检查。

Answer 3

live()显示出尽早终止该事件在性能上具有优势。 （15％-30％），而在复杂的DOM上可能会有更大的差异。还值得注意的是，捕获事件侦听器似乎比冒泡事件侦听器快一点，无论您在处理事件后如何处理它。奇怪但有趣；我只在一种浏览器中测试过]