Как работают события

События в JavaScript — это механизм реагирования на действия пользователя или изменения в DOM. Они работают по принципу прослушивания (listening) и обработки (handling).

1. Типы событий: клики, наведение, ввод и т.д.
2. Этапы:
   • Capture (погружение): событие спускается от window до целевого элемента.
   • Target: достижение элемента, на котором произошло событие.
   • Bubble (всплытие): событие поднимается обратно к window.

Пример:

button.addEventListener('click', (e) => {
  console.log('Клик обработан!');
}, false); // false — обработчик на фазе всплытия (по умолчанию)

Отмена поведения:

e.preventDefault(); // отмена стандартного действия
e.stopPropagation(); // остановка всплытия

Делегирование:

document.body.addEventListener('click', (e) => {
  if (e.target.matches('.btn')) {
    console.log('Клик по кнопке!');
  }
});