Javascript JQuery：事件绑定方法&；性能$（文档）。在（”单击“，”id“，”fn）对（”id“）。在（”单击“，”fn）

以下哪一项在性能等方面更好？为什么

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){ });

---

如果我们使用事件委派，会对性能产生什么影响？我正在寻找一个深入的解释。

请忽略最后两个示例。因为那些都死了。在谈到前两个示例时，可以根据您正在编码的上下文来决定。第一个是

事件委派

。因此，您可以在处理在运行时创建的元素时使用它。在使用事件委派期间，必须在

文档

的位置提供直接静态父级，以增强性能。第二个示例是常见示例，但在处理动态元素时无法合并。可能您可以在将动态元素插入

DOM

后使用它。但活动授权是首选

$(document).on("click", "#id", function (e) {   });

理想情况下是最好的 下面给出了所有上述指定方法的说明

$（document）.on（“click”、“#id”，函数（e）{}）

这种在文档或静态父元素（比如

body

）上绑定事件（称为

事件委派

）而不是绑定到特定元素的方式是在动态DOM操作的情况下完成的。一个很好的例子是，考虑这样一种情况：您希望将事件绑定到DOM元素，该元素在加载页面时可能不存在，但稍后将通过远程加载或动态DOM操作引入DOM。如果在DOM中引入新引入的元素之后立即为其绑定事件，那么代码就不会整洁。因此，在这种情况下，我们首先使用上述方法绑定事件，这样我们就不必担心绑定发生时元素是否存在。在这里，单击事件绑定到文档，然后委托给指定的元素。由于这是绑定到文档或静态父级的，因此与第二种方法相比，事件传播时间将更长，即事件传播速度将较慢

但这是首选的操作方式

$（“#id”）。单击（“click”，函数（e）{}）

这种绑定用于DOM不需要是静态的，但在绑定事件时指定的元素已经存在的情况。通常我们在静态DOM元素的情况下这样做。唯一的问题是，只有当必须绑定事件的特定元素已经存在于DOM中时，才可以使用这种绑定。由于这是一个直接绑定，不涉及任何委托，因此与方法1相比，事件传播速度将更快

由于第一种绑定是在文档上完成的，因此 与直接绑定到事件的第二个事件相比，速度较慢 特定元素

$（“#id”）.die（'click'）.live（'click'，函数（e）{}）和

$（“#id”）.live（“点击”，函数（e）{}）在jQuery 1.7中已被弃用
并在jQuery1.9中删除

“由于所有

.live（）

事件都附加在文档元素上， 事件在发生之前会走最长、最慢的路 处理。” -引自

这就是你问题的答案，哪种方法更快

Method 2 > Method 1 > Method 3 & 4

---

但是仍然

方法1

是首选方法。

扔掉最后两个不推荐的（奇怪的）版本。那么在前两者之间——它们是不一样的，所以不应该进行比较。前两者有着完全不同的目的。取决于您如何操作dom。1.动态dom2。静态Dom。它们都为id为的元素绑定了一个click事件。。我需要对所有这些问题进行全面的解释：-p“我需要对所有这些问题进行全面的解释”-那么你的问题对于这个网站来说太广泛了。有一个专门讨论这类问题的网站。您应该创建一个新的perf review，然后使用多个不同的浏览器运行它。如果您需要解释，最好阅读文档（文档中经常提供一些详细信息）或阅读源代码，找出发生的差异。您为什么这么认为？这对动态创建的元素和静态元素都很有用：）对性能有任何影响。。你能推荐一个链接吗？在这个链接中，我们可以看到在使用事件委派事件创建时，内部到底发生了什么，而DOM中没有元素。这不是最好的。不一样。你不能说第一个比第二个更好，因为它们有不同的用途。考虑在你的答案上增加更多的细节，只说具体是最好的CunNo被认为是答案。对性能有什么影响？@MayankGupta在静态dom元素上使用事件委托没有任何意义。因为事件委托将监视事件冒泡以触发事件。当我们使用静态事件时，观察事件冒泡是没有用的。