TGViewer
Руслан Куянец | Reactify Руслан Куянец | Reactify @reactify_it · 6.42K subscribers
Post #824 1.64K
Всплытие и погружение

Всплытие (bubbling) и погружение (capturing) являются двумя основными механизмами обработки событий в JavaScript, определяющими порядок, в котором события должны быть обработаны. Эти механизмы позволяют определить, как событие распространяется через DOM-дерево.

Всплытие - это процесс, при котором событие начинается с самого внутреннего элемента, на котором произошло событие, и продолжает распространение вверх по DOM-дереву до его корня. Например, если пользователь кликает на кнопку, событие сначала срабатывает на кнопке, затем на её родительском элементе, и так далее вверх, до элемента <html>.

Погружение - это процесс, обратный всплытию. Событие сначала перехватывается на самом верхнем уровне (например, у элемента <html>) и затем распространяется вниз по DOM-дереву до элемента, на котором произошло событие. Для активации перехвата необходимо в третьем аргументе метода addEventListener передать значение true.

Важно понимать, что по умолчанию события в JavaScript ведут себя согласно механизму всплытия. Однако, можно управлять этим поведением, используя третий параметр addEventListener. Если передать false, обработчик будет вызван при всплытии события. Если передать true, обработчик будет вызван на этапе перехвата.

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

#bubbling #capturing #JavaScript #DOM
  • 👍 14
  • 🔥 4
More from @reactify_it
  1. Oct 8, 2026Последний месяц жестко марафонил :) С утра до вечера, без выходных. Решил наконец подвести…
  2. Oct 2, 2026Что вообще для меня значит ИТ-АДАПТАЦИЯ? Это — РАБОТА ЛЮБОЙ ЦЕНОЙ. Сейчас такое время, ког…
  3. Oct 1, 2026А тем временем цены растут. Бесплатный ChatGPT, во-первых, как будто отупел, во-вторых, ли…
  4. Sep 30, 2026Ребята, если у вас уже есть опыт, но вы чувствуете, что он выглядит «непродающим» в резюме…
  5. Sep 29, 2026👩‍💻 ВСЯ инфраструктура за 30 минут: Kubernetes, ArgoCD, Grafana, CI/CD https://www.youtu…
  6. Sep 28, 2026В общем, что-то такое получилось 😁 Превью сделано нейронкой, но буду переделывать с помощ…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →