HTML 预览工具

#预览 HTML，但不执行它的 JavaScript

把文档或片段粘进编辑器，旁边的框架就会渲染出 HTML 和 CSS 的效果。检查邮件排版、爬下来的片段、生成的标记，或者一个小组件时，这样就不用先存成文件再打开了。

预览用的是禁用了脚本的沙箱 iframe。内联样式和 style 属性照常生效，但 <script> 元素不会执行。检查之前也可以先点 Format 把源码重新缩进一遍。

#预览能告诉你什么，不能告诉你什么

框架展示的是当前浏览器、当前预览尺寸下标记的样子。它是一次快速的目视检查，而不是跨浏览器测试、无障碍审计、响应式设备实验室或邮件客户端模拟器。这里看着没问题，在 Safari、老旧的内嵌浏览器、Outlook，或者 CSP 严格的环境里，仍然可能是另一副样子。

脚本被禁用了，所以交互组件、客户端模板、以及任何改动 DOM 的代码都不会跑起来。这些行为请在你清楚代码和依赖的受控开发环境里测。

#远程资源仍然是远程的

HTML 源码不会被上传去做转换，只是交给本地的预览框架。但如果标记里引用了外部图片、样式表、字体、iframe 或其他 URL，你的浏览器仍可能去请求它们，对方主机就会拿到 IP 地址、User Agent 这类常规请求元数据。

想要一个完全自包含的预览，把远程 URL 删掉或换成本地占位符。禁用脚本是一道相当重要的边界，但它不等于禁用了所有网络请求。

#格式化要小心

内置的格式化器是为了让嵌套结构好读，它可能改动标签之间有意义的空白。处理内联文本、邮件标记或模板时，请保留原件。这些限制在 HTML 格式化工具里有专门说明。

#FAQ

#为什么我的 JavaScript 不执行？

iframe 沙箱不允许脚本运行。这个查看器是用来检查 HTML 和 CSS 的，不是用来执行不可信代码或交互逻辑的。

#预览会去加载外部图片和样式吗？

会。粘贴的标记里如果有远程 URL，浏览器可能会去请求。想要自包含的预览，把这些引用删掉即可。

#这算校验器吗？

不算。浏览器渲染时往往能自动兜住不合法的 HTML。需要检查是否符合标准，请用 HTML 合规性检查工具。