Метод >removeEventListener, вызванный с такими же аргументами, как >addEventListener, удаляет обработчик.
>
>
Чтобы это провернуть, мы даём функции имя (в данном случае, >once), чтобы её можно было передать и в >addEventListener, и в >removeEventListener.
Объекты событий
В примерах мы проигнорировали тот факт, что функциям-обработчикам передаётся аргумент – объект события. В нём хранится дополнительная информация о событии. К примеру, если надо узнать, какая кнопка мыши была нажата, мы можем обратиться к свойству >which этого объекта.
>
>
Хранящаяся в объекте информация – разная для каждого типа событий. Мы обсудим эти типы позже. Свойство объекта >type всегда содержит строку, описывающую событие (например, >"click" или >"mousedown").
Распространение (propagation)
События, зарегистрированные на узлах, имеющих дочерние узлы, получат и некоторые события, случившиеся с их детьми. Если кликнуть на кнопку внутри параграфа, обработчики событий параграфа получат событие >click.
Если и у параграфа и у кнопки есть обработчики, то первым запустится более конкретный – то есть, обработчик кнопки. Событие как бы распространяется наружу, от узла, где оно случилось, до его родительского и далее до корня документа. После отработки всех обработчиков всех промежуточных узлов, очередь среагировать на событие доходит и до самого окна.
В любой момент обработчик может вызвать метод >stopPropagation объекта события, чтобы «высшие» узлы не получили его. Это может быть полезным, когда у вас есть кнопка внутри другого кликабельного элемента, и вы не хотите, чтобы клики по кнопке активировали поведение внешнего элемента.
Следующий пример регистрирует обработчики >"mousedown" как на кнопке, так и на окружающем параграфе. При щелчке правой кнопкой обработчик кнопки вызывает >stopPropagation, который предотвращает запуск обработчика параграфа. При клике другой кнопкой запускаются оба обработчика.