如何检测第三方站点上的JavaScript事件

Question

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

如果我要将JavaScript注入一个外部站点，并且希望避免覆盖onsubmit、onclick、onfocus和其他类似事件，那么有什么方法可以检测和扩展这些回调而不是覆盖它们呢？

我的想法是：

• 先在无头浏览器或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询问它们。

在添加一个将列出所有事件处理程序的属性时，已经完成了一些未来的规范工作，但我不确定它是否已经实现。您可以阅读更多关于该here的内容。

对于与onclick、onsubmit、onfocus等一起安装的事件处理程序，您可以检查所有现有的DOM元素，以查看哪些元素为这些事件分配了处理程序，然后如果愿意，可以将它们挂起。

// 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]);
        }
    }
}

Answer 2

您实际上可以通过更改addEventListener和attachEvent的原型来获得所需的东西。

// intercept events cross browser
var method;
if (HTMLElement.prototype.addEventListener) {
  method = 'addEventListener';
} else {
  method = 'attachEvent';
}
HTMLElement.prototype.realAddEventListener = HTMLElement.prototype[method];
HTMLElement.prototype[method] = function(a,b,c) {
  console.log('here are all the events being added:', arguments);
  this.realAddEventListener(a,b,c);
};

当然，在任何其他页面脚本之前将其添加到页面中是很重要的，但是它可以出现在库(如jQuery )之后或之前，但在原型上可能与prototype.js有冲突，但不确定。

您还需要检查onclicks和整个事件集，您可以通过在javascript控制台中运行console.dir(document.createElement('a'))来找到这些事件。