jQuery .on效率

Question

第一个.on函数比第二个更有效吗？

$( "div.container" ).on( "click", "p", function(){
});

$( "body" ).on( "click", "p", function(){
});

此致

Answer 1

来自jQuery文档本身关于 jQuery: .on() ：

  

jQuery可以在用于过滤委托事件时非常快速地处理表单标签＃id.class的简单选择器。所以，“＃myForm”，“a.external”和“button”都是快速选择器。 使用更复杂选择器（特别是分层选择器）的委托事件可能会慢几倍 - 尽管它们对于大多数应用程序来说仍然足够快。通过将处理程序附加到文档中更合适的点，通常可以避免使用分层选择器。例如，而不是$（“body”）。on（“click”，“＃commentForm .addNew”，addComment ）使用$（“＃commentForm”）。on（“click”，“。addNew”，addComment）。

Answer 2

第一个选择器越窄，性能越好。

但我猜第一个例子不起作用，因为你正在监视<p>个<p>个container个<p>个容器中的所有<p>容器，而{{1}}不能包含另一个{{1}}，因为它是phrasing content。

Answer 3

当然，因为浏览器只需监视一个段落的点击事件而不是整个页面。