直接cat合并HTML会破坏结构，正确做法是用BeautifulSoup提取首个文件的head和所有文件的body内容拼接，避免重复标签、ID冲突及JS/CSS路径错误。
直接用 cat 命令合并会破坏 HTML 结构
两个 index.html 文件各自包含完整的 、、，盲目用 cat a.html b.html > merged.html 会导致嵌套错误、重复标签、浏览器渲染异常——比如第二个文件的 会出现在第一个的 后面，根本不是合法 HTML。
用 Python 快速提取并拼接 body 内容（推荐）
最稳的方式是只取第一个文件的 （含 title、meta、link、script 等），再把所有文件的 内容依次追加进去。Python 的 BeautifulSoup 处理这种任务干净利落：
from bs4 import BeautifulSoup
files = ["a.html", "b.html"]
soup_out = BeautifulSoup("", "html.parser")
head_written = False
for f in files:
with open(f) as fp:
soup = BeautifulSoup(fp, "html.parser")
if not head_written and soup.head:
soup_out.html = soup.html
head_written = True
if soup.body:
for child in soup.body.children:
soup_out.body.append(child)
with open("merged.html", "w") as fp:
fp.write(str(soup_out))
注意点：
- 确保已安装：
pip install beautifulsoup4 - 如果某个文件没
，soup.body是None，代码里做了防护 - 脚本不会自动去重
<script></script>或<link>，多个文件含相同 JS/CSS 时需手动清理
用 sed/awk 粗粒度合并（适合纯静态、无 JS 交互的页面）
如果你确认两个页面都极简（比如全是 Markdown 转出的静态内容，无 JS、无动态 ID、无重复 class），可用 shell 快速裁剪再拼：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
sed -n '/<body>/,/<\/body>/p' a.html | sed '1d;$d' > tmp.txt sed -n '/<body>/,/<\/body>/p' b.html | sed '1d;$d' >> tmp.txt sed '/<body>/r tmp.txt' a.html | sed '/<\/body>/q' > merged.html
这个流程的问题很实在：
-
sed '1d;$d'删掉和行，只留中间内容 - 最终输出依赖
a.html的和开头结构，所以必须保证a.html是“主模板” - 遇到
这种带属性的，//就匹配不上——得改成/]*>/，但 shell 里正则能力弱，容易翻车
合并后必须检查的三处
哪怕用了 BeautifulSoup，也别直接上线：
- 打开
merged.html，右键「查看页面源代码」，搜、<code>、<code>，确认只有各一个起始标签 - 搜
id=，两个原文件若都有<div id="header">，合并后就出现重复 ID，JS 选中会出错 <li>打开浏览器开发者工具 → Console 标签页，看有没有 <code>Uncaught ReferenceError或Failed to load resource——路径可能因合并变相对了
真正麻烦的从来不是“怎么合”，而是合完才发现某段 JS 依赖了被覆盖的全局变量，或者 CSS class 名冲突导致样式错乱。动手前先通读两个文件的 和顶部 JS 块，比写十行脚本还省时间。
