Получаем список обработчиков элемента в DOM'е
frontend javascript russian
Допустим, что у нас есть элемент на странице. Пусть это будет div
. Наша задача - получить все обработчики этого элемента. Рассмотрим варианты решения этой задачи в различных браузерах, а именно IE
, Firefox
, Chrome
. В каждом современном браузере в консоли разработчка есть специальный UI для этих целей. Например в Chrome
это DevTools
-> Elements
-> Выбрать интересующий DOM узел
-> Вкладка Event Listeners
. В нашем случае, поговорим о получании списка обработчиков программно.
-
Использовать метод
getEventListeners(target)
. В браузереChrome
(является методом DevTools API) этот метод работает без лишних телодвижений - возвращает объект-массив эвентов на целевом элементе. -
Ситуация с
Firefox
немного сложнее. Данный метод доступен после установкиFirebug
GetEventListeners. -
В
IE
все совсем плохо, т.к такой метод не реализован в API консоли разработчика и нет extensions с его аналогами (я таких не нашел).
Итак, мы выяснили, что метод getEventListeners
не является кроссбраузерным и является частью Developer Console API, поэтому рассмотрим следующий костыль вариант решения. Для этого нам придется переопределить нативные методы Element.prototype.addEventListener
и Element.prototype.removeEventListener
(для старых версий IE
нужно переопределить свои аналоги) своими кастомными реализациями которые будут отслеживать event listeners
.
See the Pen RNzGwj by Alex Filatov (@greybax) on CodePen.
Плюс:
- Это единственный способ получить все обработчики событий (в том числе, зарегистрированные сторонними библиотеками, например,
jQuery
)
Минус:
- Cкрипт, который выполняет переопределение, должен быть выполнен первым - до
jQuery/Prototype/
и др., т.к иначеevent listeners
, зарегистрированные через эти сценарии будут не отражены.
Можно ничего не писать и использовать сторонние реализации функции, например эту.
Минусы:
- Плагин, в состоянии обнаружить и получить обработчики событий, зарегистрированные только через
jQuery
. - Завязан на
jQuery
версии >=1.8.
Итог
Универсального (кроссбраузерного) и по-настоящему хорошего варианта, к сожалению, сейчас не существует.