Javascript 在性能方面使用.delegate（）是否更好？

与我一起工作的一位开发人员开始以这种方式编写所有代码：

$('.toggles').delegate('input', 'click', function() { 
   // do something  
});

vs:

这样做对性能有什么好处吗？

delegate（）

从jQuery 1.7开始被取代

改用

.on（）

---

---

.on（）

具有出色的性能基准。并且涵盖了您的

。click（）

需求以及所需的是的，事实上，有一种更好的方法，使用。on（）：查看一下我非常确定，如果在绑定时类“toggles”的所有项都存在，那么委托（）的效率会更低。它绑定到类“toggles”的所有元素，然后，当单击其中一个元素时，检查被单击的实际DOM对象是否是输入

另一方面，click（）是bind（）的快捷方式，它直接绑定到类“toggle”的所有内容，并且总是在单击该DOM项时触发

使用delegate（）的唯一原因是如果在绑定完成后在类“toggle”的项中添加了输入

---

这也适用于使用on（）的不同重载，它替换了delegate（）和bind（）（通过替换bind，也替换了click（））。

如frenchie所述，在最新版本的jQuery中，这两个函数最终都映射到

在jQuery代码中，您可以看到委托实际上只是上的

的包装器：

delegate: function( selector, types, data, fn ) {
    return this.on( types, selector, data, fn );
},

然后，当jQuery绑定
时，单击
（以及其他事件），它也会在

上调用

：

jQuery.each( ("... click ... ").split(" "), function( i, name ) {

// Handle event binding
jQuery.fn[ name ] = function( data, fn ) {
    if ( fn == null ) {
        fn = data;
        data = null;
    }

    return arguments.length > 0 ?
        this.on( name, null, data, fn ) :
        this.trigger( name );
};
...
});

根据建议，您可以使用
.on（）
。就您的问题而言，
.on（）
和
.delegate（）
在这方面比直接将事件绑定到目标具有更好的性能。这是因为这些绑定器侦听DOM树中较高的元素，然后检查目标，因为目标池会增加。
.on（）
和
.delegate（）
肯定会提高性能

总的来说，他们的效率会更高。
是的。使用
.delegate
将减少事件处理程序的数量

假设页面中有一个表，并且希望将单击处理程序附加到每个
。
不要将事件处理程序附加到单个
s，而是将其附加到表：

$("#myTable").delegate("click", "td", function() {
    //do some thing on click of td
});

当您单击
时，事件将出现在表格中。在这里，通过使用委托，我们可以减少事件处理程序的数量，从而提高性能

最新版本的jQuery use
中不推荐使用委托。on
与delegate类似。
关于on（旧版本中的委托）与click的使用，您还需要注意另外一点：

如果您这样做：

 $("a").click(function() {  
  alert("Click on link detected");  
  $(this).after("<a href='#'>New link</a>");  
});

$（“a”）。单击（函数（）{
警报（“检测到点击链接”）；
$（此）。在（“”）之后；
});

您的新链接将不会附加到“a”单击处理程序，即使它应该附加，因为它是一个链接

但是，如果在上使用：

$("a").on("click", function(event){  
   $(this).after("<a href='#'>Nouveau lien</a>");  
});  

$（“a”）。在（“单击”）上，函数（事件）{
$（此）。在（“”）之后；
});  

新的链接用click处理程序响应click事件。
这取决于单独放置处理程序的元素数量。从jQuery 1.7开始，已被该方法取代。不要使用任何一个？可以替换上述两个语句，但它们不能做完全相同的事情。第一个只听输入元素的点击，正如sissonb所指出的，这些例子并不完全相同。就我个人而言，我认为第二种方法更快，因为您将事件侦听器直接附加到元素（或共享类的元素），而.delegate（）必须搜索DOM…，并涵盖您的
。click（）
需要和需要。我看不出它被列为不推荐使用，虽然它已被

上的取代：但性能问题仍然适用-您是绑定到某个对象上的所有单击，还是侦听该对象及其子对象上的单击，并查看它们是否与另一个选择器匹配？您使用的on（）的哪个版本仍然很重要。是的，它可能不会被弃用，因为对delegate（）的所有有效调用都可以轻松映射到对应的on（）调用@JustinEthier:谢谢，答案已修改。

。delegate（）

没有弃用。

$("a").on("click", function(event){  
   $(this).after("<a href='#'>Nouveau lien</a>");  
});