Механизм, при котором событие, инициированное на элементе DOM, распространяется "вверх" по иерархии к его родительским элементам вплоть до корня (document). По умолчанию большинство событий проходит через три фазы:

Фаза захвата (Capturing phase): Событие движется вниз от корня к целевому элементу. Слушатели событий, прикрепленные с опцией { capture: true }, срабатывают на этой фазе.
Фаза цели (Target phase): Событие достигает целевого элемента, на котором оно было инициировано. Слушатели, прикрепленные непосредственно к этому элементу, срабатывают.
Фаза всплытия (Bubbling phase): Событие движется вверх от целевого элемента к корню документа. Слушатели событий, прикрепленные по умолчанию (без { capture: true } или с { capture: false }), срабатывают на этой фазе. Это фаза, в которой происходит "всплытие" в классическом понимании.

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

Пример:

// HTML:
// <div id="parent">
//   <button id="child">Нажми меня</button>
// </div>

const parent = document.getElementById('parent');
const child = document.getElementById('child');

parent.addEventListener('click', function() {
  console.log('Событие всплыло до родителя');
});

child.addEventListener('click', function() {
  console.log('Событие на целевом элементе (кнопке)');
});

// При клике на кнопку 'child' последовательность вывода будет:
// "Событие на целевом элементе (кнопке)"
// "Событие всплыло до родителя"

Метод event.stopPropagation() может быть использован для остановки дальнейшего распространения события (как всплытия, так и захвата) после того, как оно было обработано текущим слушателем. Метод event.stopImmediatePropagation() останавливает всплытие и не дает другим слушателям на том же элементе сработать. event.preventDefault() предотвращает стандартное действие браузера, связанное с событием, но не останавливает его распространение.

Что такое всплытие в JavaScript?