Что такое делегирование событий?

Делегирование событий — это техника обработки событий в JavaScript, при которой обработчик навешивается не на каждый отдельный элемент, а на их общего родителя. Когда событие происходит на дочернем элементе, оно всплывает вверх по дереву DOM, и родительский обработчик перехватывает это событие, определяя, на каком именно элементе оно произошло.

Это позволяет:

• уменьшить количество обработчиков и, как следствие, нагрузку на память и производительность;
• динамически обрабатывать события на элементах, которые могут появляться после установки обработчика.

Пример:

const list = document.querySelector('#list');
list.addEventListener('click', event => {
  if (event.target && event.target.matches('li.item')) {
    console.log('Клик по элементу списка:', event.target.textContent);
  }
});

Здесь обработчик установлен на родительский элемент #list, а внутри проверяется, был ли клик именно по элементу с классом item.