Main page

Получаем список обработчиков элемента в DOM'е


frontend javascript russian

Допустим, что у нас есть элемент на странице. Пусть это будет div. Наша задача - получить все обработчики этого элемента. Рассмотрим варианты решения этой задачи в различных браузерах, а именно IE, Firefox, Chrome. В каждом современном браузере в консоли разработчка есть специальный UI для этих целей. Например в Chrome это DevTools -> Elements -> Выбрать интересующий DOM узел -> Вкладка Event Listeners. В нашем случае, поговорим о получании списка обработчиков программно.

Итак, мы выяснили, что метод getEventListeners не является кроссбраузерным и является частью Developer Console API, поэтому рассмотрим следующий костыль вариант решения. Для этого нам придется переопределить нативные методы Element.prototype.addEventListener и Element.prototype.removeEventListener (для старых версий IE нужно переопределить свои аналоги) своими кастомными реализациями которые будут отслеживать event listeners.

See the Pen RNzGwj by Alex Filatov (@greybax) on CodePen.

Плюс:

Минус:

Можно ничего не писать и использовать сторонние реализации функции, например эту.

Минусы:

Итог

Универсального (кроссбраузерного) и по-настоящему хорошего варианта, к сожалению, сейчас не существует.