事件监听器删除或保留 - 最佳实践

Question

我的网页上有很多jquery / javascript监听器，我会尽可能地减少它们。但是，对于剩下的听众，有些情况下我会在某些点制作display:none。这是我的问题：

1）关于听众的最佳做法是什么，我应该在显示/隐藏元素时添加或删除听众？

2）哪种表现最好？

3）如果我最终有很多听众，最好是将听众活动应用于整个身体，还是最好只将听众应用于需要听的内容？

Answer 1

一般的经验法则如下：

  

删除拆解时的事件。

由于你没有删除DOM元素，所以监听器应该保持不变，除非你有成千上万的监听器，否则没有任何缺点。

微观管理隐藏元素监听器所花费的时间不足以超过任何感知到的性能提升。

---

1. 删除元素（拆卸）时删除侦听器。
2. 聆听应用于多个元素而不是单个元素的泛型类，如果需要，使用数据属性来识别它们。
3. 倾听需要倾听的事情。

---

您还可以使用事件委派（冒泡），当您有大量需要通过监听父母来监听的孩子时：

$('div').on('click', function (e) {
  // check e.target for specific child node you require listening on
})

Answer 2

1/2）关于听众的最佳做法是什么，我应该在显示/隐藏元素时添加或删除听众？ - ＆GT;添加/删除事件很慢。您可以对它进行基准测试，但最好的建议是保留它们并让垃圾收集处理它以防您删除对象。它可以节省代码并且可能更具可读性，而且当用户没有等待/交互时，理想情况下应该发生垃圾收集（清理）（取决于实现和许多其他事情）。

2）哪种表现最佳？ - ＆GT;如果您不确定，请参见1.对其进行基准测试。

3）如果我最终有很多听众，最好是将听众事件应用于整个身体，还是最好只将听众应用于需要听的事情？ - ＆GT;多少。您的代码是否可读？如果你最终听到整个身体，你的代码将处理更多的事件（鼠标悬停在每个单独的对象，点击，键盘输入等），通常你会想要过滤掉相关的事件并将它们发送到功能。这会使你的代码非常混乱（很多if / then）并且最终会使你的性能损失比你想要保存的更多。最好的办法是只处理与进程相关的对象上的事件。方式更简单，更方便，更快捷。