以下哪一个在性能等方面更好？为什么？
1. $(document).on("click", "#id", function (e) { });
2. $("#id").on("click", function (e) { })
3. $("#id").die('click').live("click",function(e){ });
4. $("#id").live("click",function(e){ });
如果我们使用事件委托会对性能产生什么影响？我正在寻找一个深入的解释。
答案 0 :(得分：3)
<强> TLTR 以下给出了对上述所有方法的解释。
$(document).on("click", "#id", function (e) { }); 这种绑定事件（称为event delegation）在文档或静态父元素（比如body）而不是特定的特定元素上的方式是在动态DOM操作的情况下完成的。一个很好的例子是，考虑一种情况，你想要将一个事件绑定到一个DOM元素，这个元素可能在加载页面时不存在，但是会在稍后阶段通过远程加载或动态DOM引入DOM操纵。如果在DOM中引入新引入元素后立即绑定事件，则代码将不会很整洁。所以在这种情况下我们使用上面的方法来初始绑定事件，这样我们就不必担心绑定发生时元素是否存在。这里click事件绑定到文档，然后委托给指定的元素。由于这是绑定到文档或静态父节点，与第二种方法相比，事件传播时间将更长，即事件传播将是慢。 But this is the preferred way of doing it。
$("#id").on("click", function (e) { }) 这种绑定用于DOM不需要是静态的情况，但绑定事件时指定的元素存在。通常我们在静态DOM元素中执行此操作。唯一的事情是，只有当事件必须绑定到的特定元素已经存在于DOM中时，才能使用这种绑定。由于这是一种直接绑定，并且不涉及任何委派事件传播将快速与方法1相比。
由于第一种绑定是在文档上完成的，因此它将是 与事件直接绑定到的第二个相比较慢 具体要素。
$("#id").die('click').live("click",function(e){ });和$("#id").live("click",function(e){ });已在jQuery 1.7中弃用
并在jQuery 1.9中删除。“由于所有
.live()个事件都附加在文档元素上， 事件采取最长和最慢的可能路径 处理“。 - 引自https://api.jquery.com/live/。
这是您的问题的答案，哪种方法更快？
Method 2 > Method 1 > Method 3 & 4
但仍然Method 1是首选方法。
答案 1 :(得分：2)
请忽略最后两个样本。因为那些已经死了。在进入前两个样本时，可以根据您编码的上下文来决定。第一个是event delegation。所以你可以在处理运行时创建的元素时使用它。在使用事件委派期间，必须在document的位置提供直接静态父级以提高性能。第二个样本是常见的样本，但在处理动态元素时不能合并。可以在将动态元素插入DOM后使用它。但事件委托是首选。
答案 2 :(得分：1)
$(document).on("click", "#id", function (e) { });
理想情况下最好