Мучает вопрос, как эффективнее написать код выполнения функции по клику.
Я нахожу 2 варианта:
1- присвоение события клика каждому элементу,
2- присвоение события глобальному элементу (например body) и проверкой на класс.
Вот пример:
<div>
<button class="btn-1">Кнопка 1</button>
<button class="btn-1">Кнопка 1</button>
<button class="btn-1">Кнопка 1</button>
</div>
<div>
<button class="btn-2">Кнопка 2</button>
<button class="btn-2">Кнопка 2</button>
<button class="btn-2">Кнопка 2</button>
</div>
let buttons1 = document.getElementsByClassName("btn-1");
for (btn of buttons1) {
btn.addEventListener("click", () => {
console.log("Нажали на кнопку 1");
})
}
document.body.addEventListener("click", (event) => {
let btn = event.target;
if (btn.classList.contains("btn-2")) {
console.log("Нажали на кнопку 2");
}
})
