使用文档级事件侦听器而不是分离的事件侦听器

Question

想象一下以下用例：

页面包含多个按钮，每个按钮触发不同的功能。我看到的示例为每个按钮添加了事件侦听器。

但是，如果我向整个文档添加一个事件监听器，然后从该点提取给定元素，那么会发生什么，所以我知道点击了什么，并相应地调用一个函数。

在这种情况下，只有一个事件监听器，而不是按钮的数量。

这种方法会给我带来性能提升吗？

Answer 1

您所描述的内容是JavaScript事件与称为event delegation的DOM交互方式的一个特征。

基本上，通过向父元素添加一个监听器，它可以捕获并处理来自其子元素的事件，这些元素会冒出来＃34;当他们被激活时。

与将事件侦听器添加到每个子元素的替代方法相比，此方法的资源消耗更少。