如何查找已添加自定义事件侦听器的位置

How to find where a custom event listener has been added?

本文关键字：事件 自定义 侦听器 位置 添加 何查找 查找      更新时间：2023-12-10

页面上有一段第三方代码在"友好"的iframe中运行。代码可能已经或可能没有将其自己的自定义事件的侦听器添加到外部页面上的任何元素，或添加到页面上某个iframe中（在其窗口、文档或dom元素上）。

我知道自定义事件的名称，但如何判断侦听器已添加到何处？

这里有一个选项-覆盖标准实现：

var addEventListenerImplementation = Node.prototype.addEventListener;
Node.prototype.addEventListener = function (event, callback) {
    alert("Hey, someone attached an event handler to me");
    addEventListenerImplementation.call(this, event, callback);
};
document.getElementById("div").addEventListener("click", function () {
  alert("clicked");
});
div {
    background: red;
    width: 300px;
    height: 300px;
}
<div id="div"/>

这在大多数情况下都应该有效，但不幸的是，addEventListener不是附加事件的唯一方法，因此您可能还需要覆盖Event.prototype.observe。最后，如果使用element.onclick或任何其他onevent函数附加事件处理程序，则不能真正覆盖它们。一个可能的超级混乱的解决方案是：

  1. 在Node.prototype上定义一个新特性。 Object.defineProperty(Node.prototype, "ONMYCLICK", function () { get: function () { return null; }, set: function (handler) { console.log("Hey, a handler was attached!"); this.onclick = handler; } });
  2. 在您喜爱的文本编辑器中打开库的脚本，并将所有出现的.onclick替换为.ONMYCLICK
  4. 利润
相关文章：