javascript - 为多个元素添加相同的事件监听函数

Question

document.getElementById("composantes").addEventListener("click", function(event){
    event.preventDefault();
    var selector = $(this);
    console.log('click'+selector.attr('id'));
    ToggleLocalStorage(selector,'expanded');
});

这是我的代码，我希望它适用于多个 id，例如:

document.getElementById("composantes, campus, public_target").addEventListener("click", function(event){

Answer 1

您可以使用querySelectorAll。使用命名函数也可能很好，这样您就不会创建比需要更多的相同函数。如果您需要取消绑定(bind)处理程序，它也会很有帮助。

const els = document.querySelectorAll("#composantes, #campus, #public_target");
for (const el of els) {
  el.addEventListener("click", handler);
}

function handler(event) {
  event.preventDefault();
  console.log('click', this.id);
  ToggleLocalStorage($(this),'expanded');
}