如何解决如何使用JavaScript查找具有事件侦听器的所有元素？
<div id="test1" onlick="testFunction()" role="button" tabindex="0">A custom button</div>
<div id="test2" role="button" tabindex="0">Another custom button</div>
<button class="test3">A final button</button>
<ul id="test4">
<li>Cookies</li>
<li>Cream</li>
</ul>
<div id="test5">Just a div,not clickable </div>
document.getElementById('test2').addEventListener('keypress',function() {
console.log("foo");
}
)
document.querySelectorAll('.test3').forEach(item => {
item.addEventListener('click',event => {
console.log("bar");
})
})
document.getElementById('test4').onclick = function(event) {
let target = event.target;
if (target.tagName != 'li') {
event.target.addClass('highlight');
}
};
我对使用JavaScript（最好没有jQuery或其他库）来查找具有附加事件的所有DOM元素感兴趣。有许多查找具有HTML事件属性（例如#test1）的元素的方法。但是，尚不清楚如何找到通过#test2或.test3或<ul id="test4">之类的脚本添加了事件的元素。正确的答案将返回包含四个元素的数组。
一个更好的响应将另外使用事件委托来找到元素，例如<li>，但似乎不可能。
编辑：querySelectorAll（）现在选择test3类而不是test3标签
解决方法
没有本机的javascript API，您无法查找使用eventTarget.addEventListener添加的事件监听器。
无论该属性是使用javascript设置还是通过html内联设置，您仍然可以使用onclick属性添加事件-在这种情况下，您没有获得事件监听器，但是却获得了{{ 1}}属性是两件事。
Javascript没有提供这样做的api，因为可以在事件侦听器仍引用dom元素的情况下删除dom元素。
如果要跟踪与dom元素关联的事件侦听器，则必须自己进行操作。
除此Chrome之外，还有onclick命令行api，可与dom元素一起使用，但是它是开发人员工具的命令行api，因此仅
从开发人员工具调用时可以正常工作。
没有办法直接使用JavaScript。
但是，您可以使用此方法并在将事件绑定到元素时添加属性。
document.getElementById('test2').addEventListener('keypress',function() {
this.setAttribute("event","yes");
console.log("foo");
}
)
document.querySelectorAll('test3').forEach(item => {
item.addEventListener('click',event => {
this.setAttribute("event","yes");
console.log("bar");
})
})
document.getElementById('test4').onclick = function(event) {
let target = event.target;
this.setAttribute("event","yes");
if (target.tagName != 'li') {
event.target.addClass('highlight');
}
};
这是找到具有事件绑定的元素的方式：
var eventElements = document.querySelectorAll("[event='yes']");
var countEventElements = eventElements.length;