为什么在我使用 addEventListener 时加载时会发生 "click" 事件？

Question

我使用 document.querySelectorAll() 获取 HTML 文件中所有按钮的 NodeList，然后遍历每个按钮，为每个按钮添加一个事件监听器，以监听对每个按钮的点击.

document.querySelectorAll("button").forEach(node => {
  node.addEventListener("click", console.log("Button clicked"));
});

但是，在加载时，所有按钮都被点击了，我不明白为什么会这样。

Answer 1

附加的函数应该是一个处理程序，在需要时由事件侦听器执行。在您给出的示例中， console.log() 在调用 foreach 函数时被调用。

更改您的处理函数以接受参数，然后执行您的 console.log:

document.querySelectorAll("button").forEach(node => {
  node.addEventListener("click", function(ev){ console.log('Clicked'); });
});

为了便于阅读，我在这里使用了 function，但它可以是任何有效的回调。 https://developer.mozilla.org/en-US/docs/Web/API/EventListener#javascript

Why does "click" event happen on load when I use addEventListener?