如何在无复杂后端的HTML博客中用变量管理文章内容？

一、纯前端（HTML+JavaScript）实现 #

完全不用后端，直接用JS变量集中存储文章内容，再动态渲染到页面指定位置，和你要的Python变量管理逻辑一致。

操作步骤： #

• 先在HTML里给内容展示区设好容器（带唯一ID）
• 在<script>里用对象或变量存所有文章内容，集中管理
• 把变量内容插入到对应容器里

示例代码：

<!DOCTYPE html>
<html>
<head>
    <title>我的博客</title>
</head>
<body>
    <!-- 内容展示容器 -->
    <h1 id="post-title"></h1>
    <div id="post-content"></div>

    <script>
        // 所有文章内容都存在这里，编辑时直接改这里
        const myBlogPosts = {
            firstPost: {
                title: "第一篇博客的标题",
                content: "这是第一篇博客的正文，支持直接写HTML标签，比如<strong>加粗</strong>、<br>换行。"
            },
            secondPost: {
                title: "第二篇博客的标题",
                content: "第二篇内容，想改直接找这个变量就行，不用在HTML结构里翻找。"
            }
        };

        // 选择要展示的文章，比如展示firstPost
        const showPost = myBlogPosts.firstPost;

        // 把内容渲染到页面
        document.getElementById("post-title").textContent = showPost.title;
        document.getElementById("post-content").innerHTML = showPost.content;
    </script>
</body>
</html>

如果文章多，还可以把JS内容单独存成blog-content.js文件，再用<script src="blog-content.js"></script>引入，管理起来更方便。

二、用Python预生成静态HTML #

要是习惯用Python写内容，可以用Python脚本把变量里的内容转换成静态HTML文件，生成后直接部署静态文件就行，不需要运行Python后端。

操作思路： #

• 用Python变量存文章内容
• 写一个HTML模板，用占位符标记需要替换的位置
• 用Python脚本读取模板，替换占位符生成最终HTML

示例代码：

1. HTML模板（template.html）

<!DOCTYPE html>
<html>
<head>
    <title>{{post_title}}</title>
</head>
<body>
    <h1>{{post_title}}</h1>
    <div>{{post_content}}</div>
</body>
</html>

2. Python生成脚本（make_blog.py）

# 用Python变量存文章内容
post_info = {
    "post_title": "用Python生成的博客标题",
    "post_content": "这是用Python变量定义的内容，运行脚本后直接生成静态HTML，不用后端服务。"
}

# 读取模板文件
with open("template.html", "r", encoding="utf-8") as f:
    template_content = f.read()

# 替换模板里的占位符
final_html = template_content.replace("{{post_title}}", post_info["post_title"])\
                            .replace("{{post_content}}", post_info["post_content"])

# 保存成最终的HTML文件
with open("blog-page.html", "w", encoding="utf-8") as f:
    f.write(final_html)

运行这个Python脚本，就能得到可以直接部署的静态HTML文件。更新内容时，改Python里的变量，重新运行脚本生成新文件就行。文章多的话，还可以用循环批量生成多个页面。

内容的提问来源于stack exchange，提问作者Nav