捕获链接点击（事件冒泡）

Question

我对原始 JavaScript 相当陌生（习惯于使用 jQuery）。我需要捕获一些链接的点击，阻止默认操作，然后根据链接 href 执行某些操作。

有些链接是直接的<a href="example.com">Lorem</a>，但其他链接可能包含其他 html 元素（图像、跨度...）。我将相同的事件处理程序绑定到所有必要的链接。我使用了一个解决方法函数，但在 Chrome 中它使用addEventListener,useCapture是 false。

在我的事件处理程序中，我用来event.target.getAttribute('href')获取链接指向的位置。这在处理第一种链接时有效，但在单击图像或跨度时不起作用，因为 event.target 是图像或跨度，而不是链接。我猜这与事件冒泡有关，但我不太确定解决方案是什么。

Answer 1

如果您使用事件委托（推荐），即仅将一个事件处理程序绑定到文档根，那么您必须从中遍历 DOMevent.target并查看它是否在A元素内部：

var target = event.target;

while (target && target.nodeName !== 'A') {
    target = target.parentNode;
}

if (target) {
   // click was inside link
}

如果将处理程序直接绑定到每个A元素，则可以使用this而不是event.target引用处理程序绑定到的元素。阅读有关this事件处理程序的更多信息。