javascript - 如何查找添加了自定义事件监听器的位置？

Question

有一段第三方代码在页面上的“友好”iframe 中运行。该代码可能会或可能不会将其自己的自定义事件之一的监听器添加到外部页面上的任何元素，或页面上某处的 iframe 之一(在其窗口、文档或 dom 元素上)。

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

Answer 1

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

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 函数附加事件处理程序，则您无法真正覆盖它们。一种可能但 super 困惑的解决方案如下:

1. 在 Node.prototype 上定义一个新属性。 Object.defineProperty(Node.prototype, "ONMYCLICK", function () { 获取:函数(){返回null； }, 设置:函数(处理程序){ console.log("嘿，已附加处理程序!"); this.onclick = 处理程序； } });
2. 在您喜欢的文本编辑器中打开库的脚本，并将所有出现的 .onclick 替换为 .ONMYCLICK
3. ???
4. 利润