Для чего нужен метод stopPropagation

Метод stopPropagation() используется для остановки всплытия события в DOM. Когда событие происходит на элементе, оно сначала срабатывает на нём, затем поднимается (всплывает) к родителям. stopPropagation() прерывает этот процесс, не давая событию достичь вышестоящих элементов.

Пример:

document.querySelector('.child').addEventListener('click', (e) => {
  e.stopPropagation();
  console.log('Child clicked');
});

document.querySelector('.parent').addEventListener('click', () => {
  console.log('Parent clicked'); // Не сработает, если кликнуть по .child
});

Важно: метод не предотвращает действие по умолчанию (для этого есть preventDefault()). Также есть stopImmediatePropagation(), который останавливает и другие обработчики на том же элементе.