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

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

Ответ

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