Question

我想将代码注入几个页面，这些页面将处理文档中特定元素的点击。我通过jQuery成功完成了这项工作。

问题是jQuery并非在所有页面上都可用。所以它的工作时间只有一半。我想查看我点击的每个href的{{1}}属性。任何人都知道如何做到这一点？

Answer 1

您希望向文档添加一个事件侦听器，这实际上是jQuery为您所做的事情。

查看有关添加事件侦听器的MDN文档：

https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener

你的结果应该是这样的：

document.addEventListener('click', yourFunction, false);

这适用于IE9 +和所有其他浏览器。要支持IE8及以下版本，请改为使用attachEvent：

if (document.addEventListener) {
    document.addEventListener('click', yourFunction, false);
}
else if (document.attachEvent) {
    document.attachEvent('click', yourFunction, false);
}

现在，您的函数将传递一个Event对象，该对象将具有一个名为“target”的属性，该属性是被单击的节点。您也可以在MDN上阅读更多相关信息：

https://developer.mozilla.org/en-US/docs/DOM/event

同样，这只是在IE9 +和标准浏览器中。在IE7和IE8中，事件对象是窗口对象的属性......但如果你在google上的调查没有出现一些结果，那么这就是另一个问题的主题。

这基本上就是jQuery在幕后所做的事情。我建议阅读jQuery的源代码可以教你很多这样的技巧。

Answer 2

您可以将jQuery注入页面，然后照常进行。

您可以通过浏览器的JS控制台执行此操作。

var script = document.createElement('script');
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
document.head.appendChild(script);

Answer 3

jquery没有做任何你用“普通”javascript做不到的事情。您可以轻松地执行document.getElementsByName('a')，并循环结果以附加您的点击处理程序。

Answer 4

为了在每个链接上附加EventListener，并在没有jQuery的情况下检索click上的href，我可能会这样做：

function trackClick(event) {
    alert(this.href);
}


window.onload = function() {

    var links = document.getElementsByTagName('a');

    for (var i = 0; i < links.length; i++) {
        links[i].addEventListener('click', trackClick, false);
    };

}

通过javascript拦截文档中的每次点击

4 个答案: