如何使用Javascript检测链接点击（文本，图像等）？

我正在尝试编写一个跨浏览器脚本，用于检测何时在页面上单击链接（文本链接，图像或其他方式），以便我可以显示消息或广告（如插页式广告），然后将访问者指向最初点击的目标url。

该脚本必须在第三方站点（所有者在其站点上安装脚本标记 ）中工作。

如何使用javascript完成此操作？

我是否使用事件监听器？ 我是否遍历所有链接对象？ 或者是其他东西？

我的javascript技能是新手/中级，所以详细的例子/解释非常感谢。

我开始在这里使用事件监听器，但到目前为止我检测到页面上的所有点击： addEventListener代码片段翻译和用于跨浏览器检测

我会考虑使用JQuery替代方案，但我不知道如果该网站没有JQuery库，它将如何在第三方网站上运行。

谢谢大家。

Answer 1

我以为我会尝试非jQuery（以及非其他库解决方案，只是为了……好吧，填写几分钟）：

function clickOrigin(e){ var target = e.target; var tag = []; tag.tagType = target.tagName.toLowerCase(); tag.tagClass = target.className.split(' '); tag.id = target.id; tag.parent = target.parentNode; return tag; } var tagsToIdentify = ['img','a']; document.body.onclick = function(e){ elem = clickOrigin(e); for (i=0;i 

JS小提琴演示 。

修改以上内容，检测嵌入在元素中的img元素（我认为这是你想要重新阅读你的问题）：

 function clickOrigin(e){ var target = e.target; var tag = []; tag.tagType = target.tagName.toLowerCase(); tag.tagClass = target.className.split(' '); tag.id = target.id; tag.parent = target.parentNode.tagName.toLowerCase(); return tag; } var tagsToIdentify = ['img','a']; document.body.onclick = function(e){ elem = clickOrigin(e); for (i=0;i 

JS小提琴演示 。

Answer 2

要在单击动态添加或未动态链接时调用函数，请使用on（）

 $(document).on("click", "a", function() { //this == the link that was clicked var href = $(this).attr("href"); alert("You're trying to go to " + href); }); 

如果您使用的是旧版本的jQuery，那么您将使用delegate（） （请注意，切换选择器和事件类型的顺序）

 $(document).delegate("a", "click", function() { //this == the link that was clicked var href = $(this).attr("href"); alert("You're trying to go to " + href); }); 

Answer 3

这大致是如何在不使用jQuery的情况下完成的：

      foo bar   

Answer 4

我这样使用它只影响带有链接的标签，

 (function($){ $("a[href!='']").each(function(){ $(this).click(function(){ var href = $(this).attr("href") }) }); })(jQuery); 

但是在这个说明中你说你想让人们在第三方网站上使用它，所以他们可能没有jQuery所以你可能需要在你的文件顶部进行这项检查，但是你需要在使用相同的代码之后包含你的文件但是检查您的对象或函数名称

 if(typeof(jQuery) == undefined){ var head = docuent.getElementsByTagName('head')[0]; var script = document.createElement("script"); script.setAttribute("type", "text/javascript"); script.setAttribute("src", "http://yourserver.url/jquery.js"); head.appendChild(script); }