srcdoc 必须是完整合法的 html 文档，含 doctype、html、head、body 结构；双引号需转义或外层用单引号；css/js 必须内联；必须设置 sandbox 保障安全；ie 不支持需降级处理。
srcdoc 不是用来“嵌套复杂 HTML 代码”的快捷方式，它只接受一个完整、合法、自包含的 HTML 文档字符串 —— 复杂不复杂不重要，结构对不对才致命。
srcdoc 必须是完整 HTML 文档，不是任意片段
常见错误是把富文本编辑器导出的 <div>...</div> 直接塞进 srcdoc，结果 Safari 空白、Chrome 渲染错乱、Firefox 行为飘忽。因为浏览器把它当整个 HTML 文件解析，缺 、、 就没法定位上下文。
- ✅ 正确结构必须含：
<title>X</title>... -
<title></title>虽非强制，但旧版 Safari 缺失时可能拒渲染 - 未闭合标签（如
<div>hello）会导致后续内容被丢弃，不是警告，是静默截断 <li>不要依赖 Chrome 的自动补全 —— Edge 和 Safari 更严格，行为不可移植</li> <h3>双引号、CSS 和 JS 必须内联且转义</h3> <p>你在 <code>srcdoc字符串里写的任何双引号，比如style="color:red"，都会和外层 HTML 属性的双引号冲突，不处理就直接截断，iframe 空白无报错。- 推荐用单引号包裹整个属性：
srcdoc='<div style="color:red">OK</div>' - 或对双引号实体转义：
srcdoc="<div style="color:red">OK</div>" -
<script src="..."></script>和<link href="...">在srcdoc中完全失效，必须把 CSS 放<style></style>里，JS 放<script></script>标签中，且写在底部或包装进DOMContentLoaded - JS 操作 DOM 前必须确认节点已挂载，否则
document.getElementById(...)返回null
sandbox 是硬性要求，不是可选项
没加
sandbox的srcdoc相当于裸奔：脚本能执行、表单能提交、window.open()能弹窗、甚至尝试修改top.location。哪怕内容是你自己拼的，只要含用户输入（比如 Markdown 预览），XSS 风险就真实存在。- 最简安全起点：
sandbox=""—— 完全禁用脚本、表单、弹窗、存储访问 - 需要运行 JS？用
sandbox="allow-scripts"，但绝不要加allow-same-origin，否则iframe.contentDocument可读取父页 DOM - 若需调用父页方法，只能走
window.parent.postMessage()，不能依赖window.parent.xxx - 不配
sandbox就等于默认开启全部权限，现代浏览器不会帮你兜底
IE 不支持，动态更新会重载整个 iframe 上下文
IE（包括 IE11）完全忽略
srcdoc属性，既不报错也不 fallback，结果就是 iframe 空白 —— 这不是兼容性问题，是彻底不识别。- 必须提供降级路径：同时设
src和srcdoc，现代浏览器优先用srcdoc，IE 回退到src（例如指向一个静态 HTML 文件） - 执行
iframe.srcdoc = newHtml会触发全量重载：所有事件监听器、定时器、正在执行的函数、console.log输出全部销毁 - 不要用
srcdoc做高频更新（如实时 Markdown 预览每键触发）—— 改用iframe.contentDocument.write() + document.close()更轻量（但需确保同源且无sandbox限制） - 无法通过
iframe.contentWindow持久保存变量，重载后该对象指向新窗口实例
真正麻烦的不是写多复杂的 HTML，而是把结构、引号、沙箱、降级这四件事全做对 —— 少一个，要么空白，要么危险，要么只在你本地 Chrome 里“看起来正常”。
- 推荐用单引号包裹整个属性：
