如何使用 JavaScript 动态更新元标记 (OG)答案

【问题标题】：How to dynamically update Meta tags (OG) using JavaScript如何使用 JavaScript 动态更新元标记 (OG)
【发布时间】：2020-11-20 18:59:07
【问题描述】：

这是我在 Stack 社区的第一个问题。我知道之前有人问过这个问题，但我想知道如何专门使用 JS 来做这件事（我不是受过教育的编码员）。

这是我正在尝试做的事情：

var pageTitle = document.getElementsByTagName('h1');
document.getElementById("demo").innerHTML = pageTitle[0].innerHTML;

<html>
<head>
<title>Update meta tag dynamically</title>
<meta property="og:title" content="id=demo"/>
</head>
    <body>
        <h1>First header</h1>
    </body>
</html>

我知道这不是如何使用标签，只是为了告诉你我想做什么。

PS：我们不能在后端运行任何东西，所以它必须在代码。

这是我发现的其他东西，但它也不起作用：

<meta name="description" content="Old">
<h1>New</h1>
<script type='text/javascript'>
$(document).ready(function() {
    var metaTitle = document.getElementsByTagName('h1');
    // Just replacing the value of the 'content' attribute will not work.
    $('meta[name=description]').remove();
    $('head').append( '<meta name="description" content"$metaTitle">' );
});
</script>

【问题讨论】：

从您的问题来看，您不清楚您想要实现什么。请就您面临的确切问题添加一些详细信息。
好的，基本上我们有一些文档指南（大约 1700 个 html 页面），我们使用所见即所得的编辑器 (MadCap Flare) 生成这些指南。编辑器只要求您拥有一个基本样式的 HTML 页面，并在生成指南时将代码应用于其余页面。目前，我们对该基本页面有通用的元标记，因此所有页面都有相同的元标记，这没有用。我希望它们使用页面内容动态更新。上面演示的代码打算使用 H1 更新 OG 元标记的标题。
你试过 $('head').append('')
抱歉，没用。

标签： javascript metadata facebook-opengraph meta

【解决方案1】：

终于破解了密码。这是给任何未来的流浪者的：https://github.com/idaljot/meta-tag-auto-update/blob/master/meta-tag.htm

【讨论】：