在JQuery代码中使用的CSS类上的事件侦听器的性能开销

Question

如果我的标记看起来像这样:

<button id="button-1" class="nice">
<button id="button-2" class="nice">
<button id="button-3" class="nice">

我定义了以下jQuery:

$(".nice").click(function () { 
    // something happens
});

1. 建立了多少个事件监听器？1还是3？

2. 如果我有1000个按钮而不是3个按钮,我应该使用事件委托吗？

3. 如果这些类在标记中包含大量元素,那么在性能方面是不是最好定义对元素类的jQuery调用？

Answer 1

1)3个事件监听器都指向同一个函数.

2)这取决于你想要完成的事情

3)尝试做一些基准测试,看看性能变得明显的地方.我已经选择了多达1000个元素,然后同时进行动画处理 - 而且(在FF中)性能命中直到大约600-700个元素才显得不明显.性能当然取决于浏览器和JS引擎.有些(Chrome)会比其他(IE)更快.值得一提的是,对于该网站,我使用了与您的问题相同的方法.