是否可以一次更改网站上的所有锚标签属性？答案

【问题标题】：Is it possible to change all anchor tags properties on a website at once?是否可以一次更改网站上的所有锚标签属性？
【发布时间】：2019-11-02 11:40:24
【问题描述】：

我最近了解到target="_blank" 是易受攻击的，我们必须使用rel="noopener"。我正在开发一个网站项目，其中所有锚标签都使用目标属性。

只需使用以下命令就可以一次更改这些anchor texts 的颜色：

a {color: blue;}

在网站的头部。

但如果我尝试这样做

a {
rel="noopener"
target ="_blank"
}

上面的代码没有任何作用。因为 rel 和 target 不在 CSS 中。

那么有人如何为整个网站设置这些attributes？

另外，我尝试在 w3schools 上进行搜索，但他们在 CSS 中没有任何答案。

【问题讨论】：

【解决方案1】：

你将需要 JS。

document.querySelectorAll("a").forEach(a => {
   a.setAttribute("rel", "noopener");
   a.setAttribute("target", "_blank");
});

【讨论】：

【解决方案2】：

使用 Vanilla JS 查找元素。循环然后更改属性。

document.querySelectorAll('a[target="_blank"]').forEach(function(el){
    el.setAttribute('rel', 'noopener');
});

然后应用 CSS

a[target ="_blank"][rel="noopener"] {
    color: blue;
}

【讨论】：