srcdoc必须是完整html文档，需包含doctype、html、head、body结构，且双引号须转义或外层用单引号包裹；script/link标签无效，css/js须内联；sandbox为必需安全配置；ie完全不支持，须提供src降级。
srcdoc必须是完整HTML文档，不是任意片段
直接写 srcdoc="<div>Hello</div>" 会出问题：Safari 显示空白，Chrome 渲染异常，Firefox 行为不一致。浏览器把 srcdoc 值当整个 HTML 文件解析，缺 、、 就不可靠。
- ✅ 正确结构：
srcdoc="<title>Preview</title> <div>Hello</div>" -
<title></title>虽非强制，但缺失时旧版 Safari 可能拒绝渲染 - 不要依赖浏览器自动补全 —— Chrome 有时“帮忙”，Safari 和 Edge 更严格
- 未闭合标签（如
<div>hello）会导致后续内容不解析 <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中完全失效，必须把 JS 和 CSS 写进字符串里 - CSS 推荐用
<style></style>标签内联；JS 放在底部，或包装在DOMContentLoaded里，避免操作未挂载的节点
sandbox 是必选项，不是可选配置
没加
sandbox的srcdoc相当于裸奔：脚本可执行、表单可提交、window.open()可弹窗、甚至能尝试修改top.location。哪怕内容是你自己拼出来的，只要含用户输入（比如富文本编辑器预览），XSS 风险就真实存在。- 最简安全起点：
sandbox=""—— 完全禁用脚本、表单、弹窗、存储访问 - 需要运行 JS？用
sandbox="allow-scripts"，但绝不要加allow-same-origin，否则iframe.contentDocument能读取父页 DOM - 若需调用父页方法，只能通过
window.parent.postMessage()，不能依赖window.parent.xxx
IE 完全不支持，动态更新会重载整个上下文
IE（包括 IE11）完全忽略
srcdoc属性，既不报错也不 fallback，结果就是 iframe 空白。这不是兼容性问题，是彻底不识别。- 必须提供降级路径：同时设
src和srcdoc，现代浏览器优先用srcdoc，IE 回退到src（比如指向一个静态 HTML 文件） - 执行
iframe.srcdoc = newHtml会重载 iframe，JS 状态全丢 —— 已绑定的事件监听器、定时器、正在执行的函数全部销毁 - 不要用
srcdoc做高频更新（如实时 Markdown 预览每键触发）；改用iframe.contentDocument.write() + document.close()更轻量（但需确保同源且无sandbox限制）
- 推荐用单引号包裹整个属性：
