Question

一次性添加事件监听器会更好吗？或者就在事件可能发生之前？

一个例子：假设你的HTML中有一个菜单，点击即可打开。此菜单中还有一个关闭按钮，可在单击时关闭菜单。关闭按钮上的事件监听器应该设置为：页面加载时还是仅在菜单打开时设置？

换句话说，是这样的：

function open() {
  closeButton.addEventListener('click', close);
  // ...
}
function close() {
  closeButton.removeEventListener('click', close);
  // ...
}
openButton.addEventListener('click', open);

比这更好/更快？

function open() {
  // ...
}
function close() {
  // ...
}
openButton.addEventListener('click', open);
closeButton.addEventListener('click', close);

我总是喜欢选择简洁性而非性能，但它是否会产生影响？特别是当UI中有很多事件时？

Answer 1

当我们知道事件不可能发生某种依赖事件时，我们应该推迟事件绑定。这样DOM就不那么重了

至于简单部分，我们可以使用简化版本的代码，即使是他推迟了事件的绑定

Answer 2

感谢大家对此事的看法！

我解决这个问题：直接绑定点击和其他明显的操作，稍后绑定键盘和鼠标事件。

在示例中，如果我们想在用户按Escape时关闭菜单，那么我们只在菜单打开时在keydown事件上添加事件监听器以测试(rName == user & rPass == pass)。当菜单关闭时，我们会删除该监听器。

性能有什么好处：一次性或逐步设置所有dom事件？

2 个答案: