> В каком порядке сработают обработчики при клике на кнопку в DOM с вложенностью div, form, button (JavaScript)

Уровень: senior · Роль: frontend · Категория: Технические вопросы

Компании: Кэтрид Диджитал

Стек: JavaScript

> Пример ответа

При клике на кнопку в структуре <div><form><button>Click</button></form></div> обработчики сработают в порядке, зависящем от фазы распространения события (event propagation). По умолчанию событие проходит три фазы: захват (capturing), цель (target) и всплытие (bubbling). Если обработчики назначены стандартно (через addEventListener без третьего параметра true), то они срабатывают на фазе всплытия: сначала на самом вложенном элементе (button), затем на form, и последним - на div. То есть порядок: button → form → div.

Если же какой-то обработчик назначен на фазу захвата (с { capture: true }), то он выполнится до фазы цели: сначала div (захват), затем form (захват), потом button (цель), и после - всплытие в обратном порядке (form, div). Но в типичном сценарии без явного указания capture порядок - от внутреннего к внешнему.

> ГОТОВЫ К СЛЕДУЮЩЕМУ СОБЕСЕДОВАНИЮ?

Запустите тренировочную сессию с ИИ и получите детальную обратную связь, чтобы увереннее проходить реальные интервью