如何用JavaScript/来更新其他meta标签

关注

原创最新推荐文章于 2026-08-16 11:26:52 发布 615 阅读 AI 写同款· GEO 优化 ›

JS自动刷新脚本实战：从控制台一行代码到油猴完整方案在浏览器中实现网页自动刷新，是前端调试、数据看板监控和任务状态轮询的常见需求。其核心原理无外乎通过JavaScript定时器调用location.reload()重载整个页面，或借助fetch动态更新局部数据块，避免整页刷新带来的状态丢失与白屏闪烁。理解浏览器缓存机制、页面生命周期和iframe上下文，是避免“刷新无效”或“循环刷新”的关键。从控制台临时执行setTimeout，到封装带随机延迟、时间窗口和登录态判断的可配置脚本，再到利用油猴（Tampermonkey）实现刷新后依然持续运行的持久化方案，自阅读详情

下面是一个简单的例子，展示了如何使用JavaScript来更新页面中的其他meta标签。这个例子中，我们将更新description和author两个meta标签。

首先，假设我们有以下HTML代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Default description">
    <meta name="author" content="Default author">
    <title>Page Title</title>
</head>
<body>
    <script>
        // JavaScript代码将放在这里
    </script>
</body>
</html>

现在，我们将用JavaScript来更新description和author的content属性。以下是JavaScript代码的示例：

document.addEventListener("DOMContentLoaded", function() {
    // 更新description meta标签
    var metaDescription = document.querySelector('meta[name="description"]');
    if (metaDescription) {
        metaDescription.setAttribute("content", "Updated description");
    }

    // 更新author meta标签
    var metaAuthor = document.querySelector('meta[name="author"]');
    if (metaAuthor) {
        metaAuthor.setAttribute("content", "Updated author");
    }
});

在这个例子中，我们首先使用querySelector来选取name属性为"description"的meta标签。然后，我们使用.setAttribute方法来更新这个meta标签的content属性。同样的步骤也被用于更新author的meta标签。

document.addEventListener("DOMContentLoaded", function() {...});这一行代码的意思是，当文档的DOM结构完全加载并可以被JavaScript访问时，将执行括号内的代码。这样做可以确保在尝试访问或修改DOM元素之前，它们已经被正确加载。

收录于