Javascript 性能 - 迭代 dom 并添加监听器

Question

我目前正在一个大型网络项目中工作，其中我们有很多 dom 元素，需要一个监听器来监听单击/更改/...事件。主 javascript 文件的前 500 行代码如下所示。

$( ".bla" ).each(function(e) {
    $(this).on("click", function(){
        ... 
    });
});

所以基本上我们添加了 100 个监听器，对于每个监听器，我们必须迭代完整的 dom 树。我认为这将占用相当大的计算能力。有没有类似最佳实践解决方案的东西可以避免这种情况？

Answer 1

您可以使用事件委托(delegate):

$(document).on("click", ".bla", function(){
  // ...
});