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

Question

有一个第 3 方代码在页面上的“友好”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 () {
得到:函数(){ 返回空值； },
设置:函数(处理程序){
console.log("嘿，附加了一个处理程序!");
this.onclick = 处理程序；
}
});

2. 在您最喜欢的文本编辑器中打开库的脚本，并将所有出现的 .onclick 替换为 .ONMYCLICK
3. ???
4. 利润