要保存网站首页HTML，需明确目标：原始响应体用curl/wget或浏览器“查看源代码”，渲染后DOM用开发者工具Elements面板复制outerHTML，完整离线页用SingleFile扩展。
直接保存网站首页的 HTML 源码，关键看你要的是「原始响应体」还是「渲染后 DOM」——前者是服务器发来的原始 index.html，后者是 JS 执行完、动态内容注入后的最终结构。两者可能完全不同，尤其对 React/Vue 类 SPA 网站。
用 curl 或 wget 获取原始 HTML 响应体
这是最干净、可复现的方式，适合自动化或验证服务端输出。它绕过浏览器，直接向服务器发起 HTTP GET 请求，拿到 response.body 并写入文件。
-
curl -o index.html https://example.com/：默认不带User-Agent，部分网站会返回 403；建议加头：curl -H "User-Agent: Mozilla/5.0" -o index.html https://example.com/ -
wget -O index.html https://example.com/：同理，可用--user-agent="..."指定 UA - 注意路径结尾是否带
/——https://example.com和https://example.com/在某些服务器上可能触发不同重定向或 404 - 如果首页实际是
https://example.com/home或https://example.com/app，需确认真实入口 URL，否则抓到的可能是 302 跳转页或错误页
用浏览器“查看页面源代码”+Ctrl+S 保存
这个操作拿到的是服务器返回的原始 HTML（和 curl 一致），但依赖浏览器能否正常加载该页面。常见失效场景包括：页面被反爬拦截、需要登录态 Cookie、或 CSP 限制导致源码页空白。
- 快捷键：
Ctrl+U（Windows/Linux）或Cmd+Option+U（Mac）打开源码页，再按Ctrl+S直接保存 - 不要在源码页里右键“另存为”，某些浏览器（如旧版 Edge）会保存成
.txt后缀，需手动改名并确认编码为 UTF-8 - 若源码页显示“无法加载”，说明请求已失败，此时
curl也会报错，得先解决网络或认证问题
用开发者工具 Elements 面板复制 outerHTML
这是唯一能拿到「JS 渲染后完整 DOM」的方法，适用于首页依赖前端框架动态生成内容（比如轮播图、用户信息、实时数据卡片）。但代价是：它不是真正的“源码”，而是浏览器内存中的快照，含大量内联样式、临时 ID、调试注释等。
立即学习“前端免费学习笔记（深入）”；
- 打开
F12→ 切换到Elements→ 找到顶层<html>标签 → 右键 →Copy→Copy outerHTML - 粘贴进 VS Code 或 Notepad++，**务必手动保存为
index.html，编码选 UTF-8，类型选“所有文件”**；用记事本保存时若没选对，可能变成index.html.txt - 复制的 HTML 里可能含
data-reactroot、js-scope-id等框架痕迹，不适合做静态分析或 diff 对比原始发布版本
用 SingleFile 扩展保存「单文件完整网页」
当首页包含大量外部资源（字体、SVG、API 返回的图片 base64、CDN CSS）且你想离线打开即用时，SingleFile 是目前最可靠的方案。它不是只存 HTML，而是把所有依赖内联化、base64 化，生成一个自包含的 .html 文件。
- Chrome / Edge 用户去 Web Store 安装
SingleFile，点击图标 →Save as single HTML file - 生成的文件体积通常比原始大 2–5 倍，但打开无需联网，也无需额外文件夹
- 不适用于需要原始结构的场景（比如想 grep 某个 class 名或对比构建产物），因为所有资源都被重写、压缩、混淆了
- 对高度动态或 WebSocket 驱动的首页（如实时监控面板），它只能保存当前快照，无法还原交互逻辑
真正容易被忽略的一点：很多所谓“首页”其实由 Nginx/Apache 的 try_files 或前端路由接管，curl https://example.com/ 返回的可能是 index.html，但实际内容由 JS 加载。此时你必须明确目标——是要审计服务端交付物，还是归档用户看到的最终画面。选错方法，备份就失去了意义。
