数百个 DOM 元素的 JavaScript 事件监听器性能

Question

我有一个 <ul>有很多 child (接近 3000 个项目)和一些 <li>有很多级别。我在“点击”(我使用的是 jQuery)上附加了一个事件监听器，我用它来切换 <li> 的子项的可见性。 .

我想知道拥有这么多事件监听器对性能有何影响。 (至少有 1000 个!)。这对性能来说是个大问题吗？

我并没有真正看到新的网络浏览器在性能方面有什么问题，但 IE8 似乎非常慢。对所有事情都进行事件监听是不是非常不负责任？!

Answer 1

答案是大大的YES。 是的，它会影响性能。事件委托(delegate)正是为此而建立的。不要将您的处理程序绑定(bind)到每个 li，而是将它绑定(bind)到它的父级 ul。这样 ul 会将 click 事件委托(delegate)给 li。

$("ul").on("click", "li", function () {
 //your code
});