如何改变多个元标签描述与单一变量(香草JS)?

Question

我的网站上有以下meta标签:

<meta name="description" content="content here" />
<meta itemprop="description" content="content here">
<meta property="og:description" content="content here" />

所有这3个元属性是必要的在我的网站。但是，有没有一种方法可以在JS变量中引用单个描述，我可以将其传递给每个内容属性?

Answer 1

您可以使用带有meta[key=value]的querySelector，然后使用setAttribute(key,value)设置Attribute。

document.querySelector("meta[name='description'" ).setAttribute("content", "some new meta description");
document.querySelector("meta[itemprop='description'" ).setAttribute("content", "some new meta description");
document.querySelector("meta[property='description'" ).setAttribute("content", "some new meta description");

Answer 2

这是一个简单的方法

<meta class="meta" name="description" content="content here" />
<meta class="meta" itemprop="description" content="content here">
<meta class="meta" property="og:description" content="content here" />
<script>
document.querySelectorAll(".meta").forEach((el) => {
el.setAttribute("content", "your content");
})
</script>

Answer 3

let text = 'hello world';

let Allmeta = document.querySelectorAll('meta');
Allmeta.forEach((meta) => {
if (meta.getAttribute('name') == 'description' || meta.getAttribute('itemprop') == 'description' || meta.getAttribute('property') == 'og:description') {
meta.setAttribute('content',text)
}
});