添加 aria-label 并使用 JQuery 附加到外部链接

Question

好的朋友，我正在尝试获取在新窗口中打开的所有链接，并向它们添加 aria-label 属性，其中包含链接文本加上“在新选项卡中打开”。

所以我想接受这个：

<a href="..." target="_blank">My link</a>

并将其变成：

<a href="..." target="_blank" aria-label="My link - opens in new tab">My link</a>

我认为我走在正确的轨道上，但并不完全正确。这是我所拥有的：

$('body a[target="_blank"]:not([aria-label])').attr("aria-label", (.textContent) + "- opens in new tab" });

Answer 1

这个表达式是一个语法错误：

(.textContent) + "- opens in new tab"

您的意思是对于每个匹配元素，您希望将其文本内容用于此属性吗？ 在这种情况下，您可能需要循环遍历元素，以便有一个可以访问该值的上下文。 像这样的东西：

$('body a[target="_blank"]:not([aria-label])').each(function () {
    $(this).attr("aria-label", $(this).text() + "- opens in new tab");
});

或者，如果您特别想在元素上使用

.textContent

属性，您可以引用 DOM 元素本身作为回调函数的第二个参数：

$('body a[target="_blank"]:not([aria-label])').each(function (i, el) {
    $(el).attr("aria-label", el.textContent + "- opens in new tab");
});