javascript - 如何检测第三方网站上的 JavaScript 事件

Question

是否有任何方法(实现或只是理论上)可以检测第三方网站上分配的 JavaScript 事件和操作？

如果我将 JavaScript 注入(inject)国外网站，并希望避免覆盖 onsubmit、onclick、onfocus 和其他此类事件，有吗有什么方法可以检测和扩展此类回调而不是覆盖它们？

我的想法:

• 事先在 headless 浏览器或 JavaScript 引擎中运行网站，以捕获所有执行的 JavaScript
• 即时解析 JavaScript，并希望第三方 JavaScript 符合我的解析器的期望

Answer 1

如果您只想添加新的事件处理程序而不覆盖现有的事件处理程序，可以使用 addEventListener() 或 attachEvent()(适用于旧版本的 IE)而不是设置 .onclick、.onsubmit 等...来添加新的事件处理程序而不影响以前的事件处理程序。

这是一个简单的跨浏览器功能来添加事件:

// add event cross browser
function addEvent(elem, event, fn) {
    if (elem.addEventListener) {
        elem.addEventListener(event, fn, false);
    } else {
        elem.attachEvent("on" + event, function() {
            // set the this pointer same as addEventListener when fn is called
            return(fn.call(elem, window.event));   
        });
    }
}

据我所知，常规 javascript 没有跨浏览器的方式来询问现有 DOM 对象，以查看哪些对象通过 addEventListener 或 attachEvent 安装了常规 javascript 事件处理程序>。如果事件处理程序与 jQuery 一起安装，则可以通过 this technique 询问它们。 .

future 已经完成了一些规范工作来添加一个列出所有事件处理程序的属性，但我不确定它是否已实现。您可以阅读更多相关信息 here .

对于使用 onclick、onsubmit、onfocus 等安装的事件处理程序，您可以检查所有现有 DOM 元素以查看哪些它们为这些事件分配了处理程序，然后您可以根据需要 Hook 它们。

// add other events here you are interested in
var events = ["onclick", "onsubmit", "onfocus", "onblur"];
var elems = document.getElementsByTagName("*"), item;
for (var i = 0; i < elems.length; i++) {
    item = elems[i];
    for (var j = 0; j < events.length; j++) {
        if (item[events[j]]) {
            console.log("event handler for " + events[j]);
        }
    }
}