document.implementation.createHTMLDocument()返回一个全新、独立、未挂载的HTML Document对象，具备完整DOM操作能力但无window、事件循环或布局树，常用于安全解析HTML字符串或模板预处理。
Document.implementation.createHTMLDocument 会返回什么
它返回一个全新的、独立的 Document 对象，不是当前页面的副本，也不挂载到 DOM 树中，没有 window、location 或事件循环，但具备完整的 HTML 解析和 DOM 操作能力。常用于模板预解析、服务端渲染模拟、或安全地解析不受信 HTML 字符串。
为什么不能直接 new Document() 或用 document.cloneNode(true)
new Document() 在标准中不存在，浏览器会报 TypeError: Illegal constructor；document.cloneNode(true) 复制的是当前文档结构，包含所有副作用（如已绑定的事件、全局状态、样式作用域污染），且无法重置 document.documentElement 的初始状态。而 createHTMLDocument() 生成的是干净、隔离、可重置的空白 HTML 文档。
createHTMLDocument 的参数陷阱和兼容性注意点
该方法接受一个可选字符串参数作为新文档的 title，但不同浏览器处理方式不一致：Chrome 和 Firefox 会将该字符串设为 document.title 并写入 <title> 元素；Safari 则只设 document.title，不自动创建 <title> 节点。更关键的是 —— 它**不接受第二个参数指定 doctype 或 base URL**，也无法控制是否启用 strict mode。
- 调用后必须手动插入
<title>到head中，否则document.title和实际 DOM 不同步 - 返回文档的
document.body初始为空，但document.head已存在，可直接 append - 在 IE 中完全不可用，需降级为
DOMParser().parseFromString('<!DOCTYPE html><html><head></head><body></body></html>', 'text/html')
怎么安全注入 HTML 字符串并避免 XSS 风险
不能直接用 innerHTML 写入不受信内容——虽然文档是“独立”的，但若后续通过 importNode 或序列化回主文档，仍可能触发脚本执行。正确做法是用 DOMParser 解析后再导入，或使用 document.createElement('template').content 中转：
立即学习“前端免费学习笔记（深入）”；
const doc = document.implementation.createHTMLDocument('');
const parser = new DOMParser();
const parsed = parser.parseFromString('<div onclick="alert(1)">click me</div>', 'text/html');
// 注意：parsed 仍是完整文档，取 body.firstChild 更安全
doc.body.appendChild(doc.importNode(parsed.body.firstChild, true));
如果只是解析片段，优先用 template 元素：const t = document.createElement('template'); t.innerHTML = untrustedHTML;，它天然阻止脚本执行且无需新建文档。
真正容易被忽略的点是：这个“镜像文档”里的 document.defaultView 是 null，所以任何依赖 window 的库（比如 jQuery 旧版、某些 polyfill）会直接报错；另外，getComputedStyle、offsetHeight 等布局相关 API 在无 layout tree 的环境下一律返回默认值或 0，别指望它能真实渲染测量。
