是否可以一次更改網站上的所有錨標簽屬性？

Question

我最近了解到target="_blank"很容易受到攻擊，我們必須使用rel="noopener" 。 我正在開發一個網站項目，其中所有錨標簽都使用目標屬性。

只需使用以下命令就可以一次更改這些anchor texts的 colors：

a {color: blue;}

在網站的頭部。

但如果我嘗試做

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

上面的代碼沒有任何作用。 因為 rel 和target不在CSS中。

那么有人如何為整個站點設置這些attributes呢？

另外，我嘗試在 w3schools 上進行搜索，但他們在 CSS 中沒有任何答案。

Answer 1

你將需要 JS。

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

Answer 2

我個人會為此使用 JS。 css: https://developer.mozilla.org/en-US/docs/Web/CSS/attr js: httpsA///en -orgattributes//developer.mozilla//

Answer 3

使用 Vanilla JS 查找元素。 循環然后更改屬性。

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

然后申請 CSS

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