我已经看过以下问题：
但是，它们都没有回答如何使用创建连接到节点的事件侦听器的列表addEventListener，而不addEventListener在创建事件侦听器之前修改原型。
VisualEvent不会显示所有事件侦听器（特定于iPhone的事件侦听器），而我想以编程方式（某种程度上）做到这一点。
Answers:
Chrome DevTools，Safari Inspector和Firebug支持getEventListeners（node）。
你不能
获取连接到节点的所有事件侦听器的列表的唯一方法是拦截侦听器附件调用。
说
将事件侦听器追加到类型设置为type的事件侦听器的关联列表，将侦听器设置为侦听器的捕获和将捕获设置为捕获的捕获，除非该列表中已经存在具有相同类型，侦听器和捕获的事件侦听器。
意味着将事件侦听器添加到“事件侦听器列表”中。就这样。没有关于此列表应该是什么以及您应该如何访问它的概念。
由于没有本地方法可以执行此操作，因此我发现的侵入性较小（不要添加任何“旧”原型方法）：
var ListenerTracker=new function(){
var is_active=false;
// listener tracking datas
var _elements_ =[];
var _listeners_ =[];
this.init=function(){
if(!is_active){//avoid duplicate call
intercep_events_listeners();
}
is_active=true;
};
// register individual element an returns its corresponding listeners
var register_element=function(element){
if(_elements_.indexOf(element)==-1){
// NB : split by useCapture to make listener easier to find when removing
var elt_listeners=[{/*useCapture=false*/},{/*useCapture=true*/}];
_elements_.push(element);
_listeners_.push(elt_listeners);
}
return _listeners_[_elements_.indexOf(element)];
};
var intercep_events_listeners = function(){
// backup overrided methods
var _super_={
"addEventListener" : HTMLElement.prototype.addEventListener,
"removeEventListener" : HTMLElement.prototype.removeEventListener
};
Element.prototype["addEventListener"]=function(type, listener, useCapture){
var listeners=register_element(this);
// add event before to avoid registering if an error is thrown
_super_["addEventListener"].apply(this,arguments);
// adapt to 'elt_listeners' index
useCapture=useCapture?1:0;
if(!listeners[useCapture][type])listeners[useCapture][type]=[];
listeners[useCapture][type].push(listener);
};
Element.prototype["removeEventListener"]=function(type, listener, useCapture){
var listeners=register_element(this);
// add event before to avoid registering if an error is thrown
_super_["removeEventListener"].apply(this,arguments);
// adapt to 'elt_listeners' index
useCapture=useCapture?1:0;
if(!listeners[useCapture][type])return;
var lid = listeners[useCapture][type].indexOf(listener);
if(lid>-1)listeners[useCapture][type].splice(lid,1);
};
Element.prototype["getEventListeners"]=function(type){
var listeners=register_element(this);
// convert to listener datas list
var result=[];
for(var useCapture=0,list;list=listeners[useCapture];useCapture++){
if(typeof(type)=="string"){// filtered by type
if(list[type]){
for(var id in list[type]){
result.push({"type":type,"listener":list[type][id],"useCapture":!!useCapture});
}
}
}else{// all
for(var _type in list){
for(var id in list[_type]){
result.push({"type":_type,"listener":list[_type][id],"useCapture":!!useCapture});
}
}
}
}
return result;
};
};
}();
ListenerTracker.init();
您可以使用$ ._ data（$（'（[selector]'）[0]，'events'）;获得所有jQuery事件。将[选择器]更改为所需的内容。
有一个插件可以收集jQuery附加的所有事件，称为eventsReport。
我也写自己的插件，以更好的格式做到这一点。
但是无论如何，我们似乎无法收集addEventListener方法添加的事件。也许可以包装addEventListener调用来存储在包装调用之后添加的事件。
似乎是使用开发工具查看事件添加到元素中的最佳方法。
但是您在那里看不到委托事件。因此，我们需要jQuery eventsReport。
更新：现在我们可以看到由addEventListener方法添加的事件，请参见此问题。
我找不到使用代码执行此操作的方法，但是在Firefox 64库存中，事件显示在开发人员工具检查器中每个HTML实体的旁边，如MDN的“ 检查事件侦听器”页面上所指出的那样，如下图所示：
