JS одно действие при нажатии разных блоков
Есть набор из четырех блоков, у каждого из которых имеется класс block. И мне нужно, чтобы при клике на один из них, происходило действие, например добавление класса, именно на кликнутый блок. И как это можно сделать? потому что ивентЛисенер как я понял, не может так обработать массив. А дублировать код, для каждого блока, не думаю что стоит.
P.s. при клике на разные блоки, действия одинаковые, разница только в самих блоках, но не в действии
Ответы (1 шт):
Автор решения: Igor
→ Ссылка
document.querySelectorAll(".block").forEach(
el => el.addEventListener("click", function(e) {
this.classList.add("green");
})
);
.block {
border: 1px solid black;
width: 100px;
height: 100px;
display: inline-block;
}
.green {
background: lightgreen;
}
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>