应使用Ctrl+U获取原始HTML源码并用Diff插件比对，禁用缓存后可通过网络面板复制document响应体进行字节级差异分析。
你需要在火狐浏览器中快速比对两个网页的原始HTML结构差异，比如验证A/B测试页面是否仅修改了指定DOM节点、排查CDN缓存导致的代码不一致，或确认上线前后源码是否被意外篡改。
先获取两份纯净的源代码文本
打开第一个目标网页 → 按 Ctrl+U 查看源代码 → 全选（Ctrl+A）→ 复制（Ctrl+C）→ 粘贴到记事本或VS Code中保存为 page_a.html。
切换标签页，打开第二个目标网页 → 同样按 Ctrl+U → 注意：这一步必须用 Ctrl+U，不能用开发者工具里的 Elements 面板内容，因为 Elements 显示的是渲染后动态生成/修改过的 DOM，而你要对比的是服务器返回的原始 HTML 字节流。
全选→复制→粘贴到新文件，保存为 page_b.html。
用浏览器插件一键比对（推荐）
在火狐地址栏输入 about:addons → 点击右上角“浏览所有扩展” → 搜索 “diff” → 安装官方评分 4.7+ 且近期更新的插件，例如 Diff Checker for Firefox 或 Page Diff。
安装后重启浏览器，访问任意网页 → 点击工具栏新增的 Diff 图标 → 选择“Compare two files” → 分别上传 page_a.html 和 page_b.html → 点击 Compare。
插件会高亮显示新增、删除、修改的行，左侧为 A 版本，右侧为 B 版本，颜色区分清晰。注意：部分插件默认忽略空白符和换行差异，如需严格字节级比对，请在设置中关闭“ignore whitespace”选项。
不用插件：用火狐内置开发者工具辅助定位差异点
方法一：用响应式设计模式并排查看
打开第一个网页 → 按 Ctrl+Shift+M 进入响应式设计模式 → 点击右上角“…（更多选项）”→ 选择“显示两个视图” → 在第二个视图中输入第二个网页 URL 并加载。
此时两个网页并排渲染，可肉眼快速识别布局、文字、按钮等可见层差异；但此法无法发现隐藏注释、meta 标签顺序、script src 路径微小变动等源码级变化。
方法二：用控制台提取关键节点做字符串比对
在第一个网页按 Ctrl+Shift+I 打开开发者工具 → 切换到 Console 面板 → 输入：document.documentElement.outerHTML.substring(0, 5000) → 回车，复制输出结果前5000字符。
切换到第二个网页 → 同样打开 Console → 输入相同命令 → 复制结果。
把两段字符串粘贴进在线 diff 工具（如 diffchecker.com）→ 点击 Compare。这招适合只关心开头关键结构（doctype、head、首屏 script）是否一致，省去下载完整文件的步骤。
方法三：用网络面板抓取原始响应体
第一步：在第一个网页按 Ctrl+Shift+E 打开网络面板 → 刷新页面 → 找到顶部第一行（通常是文档本身，类型为 document）→ 右键 → “复制” → “复制响应”。
第二步：切换到第二个网页 → 同样操作，复制其 document 响应体。
第三步：把两段响应体分别粘贴进文本编辑器 → 使用编辑器自带的“比较文件”功能（VS Code 按 Ctrl+P 输入 >Compare Active File with…）→ 立即看到逐行差异。
【关键前提】 必须确保两次抓包时都禁用了浏览器缓存：在网络面板左上角勾选“禁用缓存”，否则第二次可能拿到的是内存缓存副本，导致误判。
