#3.7 Пример Делегирования на JavaScript, создаём поведение Счётчик
JS: Event delegation (Делегирование событий)
Что Делегирование событий позволяет навесить обработчик события на родителя вместо того, чтобы вешать обработчики на каждый элемент, у которого может быть вызвано событие. Справедливо для ситуации, когда отнотипных событий много. Если их одно-два, смысла в делегировании нет. Почему работает: из-за фичи Event Bubbling (всплытие события). Когда событие происходит с любым элементом на странице, о нём "знают" все предки (событие всплывает как пузырёк воздуха в воде до самого корня DOM)...
Что такое делегирование событий в JS и как это работает Это техника, которая позволяет обрабатывать события на родительских элементах вместо на дочерних. Мы знаем, что события всплывают вверх по DOM-дереву. То есть если вы установите обработчик события на родительском элементе, он будет вызван при срабатывании и на любом дочернем. Вот пример, как можно это использовать: // Получаем родительский элемент const parentElement = document.getElementById('parentElement'); // Добавляем обработчик на родительский элемент parentElement.addEventListener('click', function(event) { // Проверяем, что кликнули на нужный дочерний элемент if(event.target.classList.contains('childElement')) { // Обрабатываем событие console.log('Событие обработано на дочернем элементе'); } }); Тут мы устанавливаем обработчик на родительский элемент и проверяем, что событие произошло именно на дочернем элементе. #javascript #урок Учитесь фронтенду с нами — подпишитесь 💻