Зачем разработчики придумали фазу всплытия и фазу захвата для событий?

#javascript

Привет.

Не понимаю насчет того, зачем придумали фазу всплытия и фазу захвата для событий.
ранняя модель событий DOM 0 была понятной: щелкнул мышкой на объекте-узле и выполнился
какой-то кусок кода (который запихали в функцию). и все. а с этими всплытиями и перехватами
мне не понятно, зачем их вообще придумали. какой смысл затрагивать НЕСКОЛЬКО кусков
кода (функций-обработчиков) при ОДНОМ событии? какие есть самые простые и хорошо иллюстрирующие
примеры применения этого?
    

Ответы

Ответ 1

Самый простой и часто используемый пример - это делегирование событий. Вы устанавливаете
один обработчик событий на родительский элемент, а внутри проверяете реальный целевой
элемент события и реагируете соответствующим образом.

Это позволяет не только экономить память (один обработчик вместо многих), но и обрабатывать
события на динамически создаваемых элементах, не назначая для них обработчик руками.

А вот простой пример использования нескольких обработчиков одного и того же события:


  Всплытие – это удобно. Не прекращайте его без явной нужды, очевидной и архитектурно
прозрачной.
  
  Зачастую прекращение всплытия создаёт свои подводные камни, которые потом приходится
обходить.
  
  Например:
  
  
  Мы делаем меню. Оно обрабатывает клики на своих элементах и делает для
  них stopPropagation. Вроде бы, всё работает.
  Позже мы решили отслеживать все клики в окне, для какой-то своей функциональности,
к примеру, для статистики – где вообще у нас кликают люди. Например, Яндекс.Метрика
так делает, если включить соответствующую опцию.
  Над областью, где клики убиваются stopPropagation, статистика работать не будет!
Получилась «мёртвая зона». Проблема в том, что stopPropagation убивает всякую возможность
отследить событие сверху, а это бывает нужно для реализации чего-нибудь «эдакого»,
что к меню отношения совсем не имеет.
  


Источник