javascript - 如何检测用户点击了内部或外部链接

Question

我需要知道用户是否点击了内部或外部链接来提醒他们。
我的网站上有很多内部和外部链接。

我的内部链接是这样的:

<a href="about.php">about</a>
<a href="tools/draw.php">draw graph</a>

我只需要在点击外部链接时提醒。

Answer 1

(我在这里包括了两种方法:一种方法使用 jQuery，另一种不使用 jQuery。如果您不想使用 jQuery，请跳到粗体标题)

实现此目的的一种方法是向每个外部链接添加一个类，然后将事件处理程序附加到该类中的所有内容，当您单击该链接时会发出警报。不过，这很乏味，因为您必须将类添加到每个 外部链接，而且它不会用于用户生成的内容。

您可以使用 jQuery 以及 CSS 选择器 a[href^="http"] 来选择所有外部链接，然后附加一个事件处理程序来引发您的警报当他们被点击时:

$('a[href^="http"]').click(function() {
    alert();
});

a[href^="http"] 表示“具有链接的 a 标签，该链接必须以 'http' 开头。”所以在这里我们选择所有以 http 开头的元素 - 即每个外部链接 - 然后将其设置为当您单击它们时弹出警报。

非 jQuery 方法

如果你想在没有 jQuery 的情况下执行此操作，你将需要使用 document.querySelectorAll('a[href^="http"]') 并绑定(bind)每个元素的点击事件该函数返回的数组。看起来像这样:

var externalLinks = document.querySelectorAll('a[href^="http"]');
for (var i = externalLinks.length-1; i >= 0; i--) {
    externalLinks[i].addEventListener("click", function() { alert(); }, false);
}