Javascript 检测用户是否单击了6个div id元素中的任何一个

我有6个div id，我需要写一个if条件，只有当用户点击了这6个惟一id中的任何一个时，我才能执行某些操作

我知道我可以做下面这样的事情，但我真的不想要6个这样的函数一个接一个。有更好的方法吗

var el = document.getElementById('one');

el.onclick = function() {
    console.log('Click just happened');
};

---

假设您可以更改HTML，则为所有6个元素指定一个特定的类。然后，getElementsByClassName返回匹配的元素，您可以迭代这些元素以获得所有相同的事件

var elementsList = document.getElementsByClassName("class");

for (var i = 0; i < elementsList.length; i++) {
    elementsList[i].addEventListener('click', function(){
        console.log('Click just happened');
    });
}

编辑：按ID选择：

const parent=document.getElementByIdparent Array.fromparent.children.forEachdiv=>{ div.addEventListenerclick，e=>{ console.log `${e.target.innerText}已单击` } } 母公司{ 显示器：flex； } id1， id2， id3， id4{ 宽度：50px； 高度：50px； 背景色：aaa； 显示器：flex； 证明内容：中心； 对齐项目：居中； 保证金：1px } 1. 2. 3. 4.

---

一般来说，随着时间的推移，使用类或数据属性来完成此类任务/想法更为合适。很容易破坏依赖于特定id名称列表与特定HTML元素列表匹配的代码

总之，id列表非常基本/简单：

变量列表=[ "一",， “两个”， "三",， "四",， "五",， “六” ]; list.forEachfunction标识符、索引{ el=document.getElementByIDelement； el.onclick=函数{ console.log单击id:+idElement+刚刚发生； }; }; 一 二 三 四 五 六 另一个因素 如果您使用CLASS，您可以使用这个函数，只需将类名添加到您想要的所有div中

 (function () {
    const divs = document.querySelectorAll('.div-class');
    divs.forEach(div => div.onclick = _ => console.log('hello'));
})()

如果使用ID，则必须在以下数组中添加div的ID

这可能行得通

const-father=document.queryselector-father const children=父亲、子女； […子项].forEachbutton=>{ button.AddEventListener单击，e=>{ console.loge.target.innerText } } 一 二 三 四

---

您可以编辑HTML并为每个HTML添加一个类吗？如果可以的话，你可以把它们全部放到一个数组中，然后对它们应用一个函数。我不想要列表中的所有项目。为什么不给最后6个项目指定一个类，而不是每个项目？即使不能向元素添加类，也可以使用它们的ID。像这样的。queryselectoral'one，two，three，four'…事实上，我通过编辑来选择具有相同逻辑的ID。

 (function () {
    const divs = document.querySelectorAll('.div-class');
    divs.forEach(div => div.onclick = _ => console.log('hello'));
})()

(function () {
    const divs = ['id-1', 'id-2', 'id-3'];
    divs.forEach(div =>document.querySelector(`#${div}`).onclick = _ => console.log('hello'));
})()