在整个文档中监听事件的成本有多高？

Question

我想在HTML页面中的许多按钮上使用事件委托。这些按钮遍布整个页面，我想知道在点击事件上收听整个文档会有多昂贵，然后让点击事件触发一个事件委托处理程序。这比20多个按钮上的每个按钮都要贵（它可以增长到超过100个按钮，是的，它是愚蠢的）会更昂贵吗？

Answer 1

  

我不知道它会如何更昂贵，因为它会监听文档对象的点击而不是25个锚点对象

这里的关键想法是深度。您的事件必须在执行之前遍历DOM。如果您的元素位于DOM树的深处，那么可能会注意到某些性能下降。

要记住几件事：

• 锚点的数量对于事件委托无关紧要，这是真的
• 一般来说，在大多数情况下，事件委托是一种更好的选择，但它并不是一直有用

我的建议是分析这些问题，了解事情是如何运作的，并通过良好的老式常识来做出决定。

Answer 2

我不知道它会如何更昂贵，因为它会监听文档对象的点击而不是25个锚点对象。话虽如此，只有25-30个按钮不是真正的资源密集型，所以你可能不需要担心这个。

Answer 3

这是例如jQuery“live”方法所使用的策略：监听整个文档然后根据条件（即选择器）测试发送者。除非选择器无法忍受，否则这种技术对于大型和不断增长的目标集更有效。

Answer 4

你辛苦了吗？工作代码不是很好的代码。

如果您在页面中使用20~40个按钮侦听器，而不是使用委托，那么它将起作用，可能您甚至不会看到任何性能问题。我想你会使用forin / $。每个绑定所有那些监听器，所以你不需要为每个监听器编写代码。

所以，我的请求是请使用委托。

如果您将来需要更改逻辑或决定测试应用程序，那么您将遇到麻烦。