单击子元素时捕获 event.target 的正确方法

Question

我想在单击锚点时调用javascript函数并捕获元素的href和title属性。如果元素的内容是纯文本，我的代码工作正常，但是当我在锚标签中引入新元素(例如标签和图标(时，e.target现在是标签或图标，因此我无法再获取href属性。

我可以编写一些代码来检查元素类型，如果它不是锚点，请找到父元素，但我想知道我的函数是否有更好的方法从 event.target 获取锚元素，即使单击了子元素？

function doStuff(e) {
console.log(e.target.getAttribute("href"));
console.log(e.target.getAttribute("title"));
e.preventDefault();
}

<a href="/bob" title="Bob" onClick="doStuff(event)">
<i class='fa fa-user'></i>
<label>Bob</label>
</a>

Answer 1

您可以使用event.currentTarget，它应该为您提供已将事件绑定到的锚元素

Answer 2

单击子/子元素时，可以通过 ：event.target.offsetParent获取对父元素的引用。