iframe本地HTML打不开是因浏览器禁止file://协议跨文件加载，唯一可靠方案是用HTTP服务（如Live Server）托管，使页面运行在localhost下实现同源。
iframe src 指向本地 HTML 文件打不开？
浏览器直接双击打开含 iframe 的 HTML 文件时，src 引用的本地子页面（如 ./child.html）大概率空白，控制台报 Blocked loading resource from url not allowed in this context 或 CORS policy: Blocked —— 这不是代码写错了，是浏览器安全策略在拦截。
- Chrome / Edge / Safari 默认禁止
file://协议下跨文件加载资源，哪怕都在同一目录 -
iframe的src是相对路径时，实际解析为file:///.../child.html，触发同源限制（file://没有“源”的概念，被视作不合法上下文） - Firefox 稍宽松但仍有随机失败，不可依赖
怎么让 iframe 正常加载本地 HTML？
唯一可靠方式：用本地 HTTP 服务托管，让页面运行在 http://localhost:xxxx/ 下。所有现代前端开发都基于此前提，没有例外。
- VS Code 安装插件
Live Server，右键 HTML 文件 → “Open with Live Server”，自动启动服务并打开http://127.0.0.1:5500/xxx.html - 命令行快速起服务：
python3 -m http.server 8000
（Python 3）或npx http-server -p 8000
（需 Node.js） - 确保
iframe的src是相对路径（如src="child.html"），服务启动后会自动解析为http://localhost:8000/child.html，同源通过
iframe 加载失败但没报错？检查这三点
即使走 HTTP 服务，仍可能白屏，常见原因不是路径错，而是更隐蔽的配置或权限问题：
-
child.html文件本身存在语法错误（如未闭合<script>、<body>缺失），导致浏览器解析中断，iframe内容为空且无明确错误提示 -
iframe设置了sandbox属性但未加allow-scripts或allow-same-origin，会禁用脚本执行和 DOM 访问，子页面 JS 不运行、样式不生效 - 父页面或子页面设置了
Content-Security-Policy响应头（或<meta http-equiv="Content-Security-Policy">），禁止frame-src或child-src加载本地资源
为什么不能用 file:// + base 标签或 data URL 绕过？
有人试过在父页加 <base href="http://localhost/"> 或把子页面内容转成 data:text/html;base64,... 放进 src，结果更糟：
立即学习“前端免费学习笔记（深入）”；
-
<base>对file://无效，浏览器忽略；对 HTTP 有效但没必要，相对路径已够用 -
data:URL 虽能绕过跨域，但长度受限（Chrome 约 2MB）、无法调试、子页面内引用的 CSS/JS 仍会因协议不匹配而 404 - 真实项目中，子页面往往带 AJAX、
fetch、localStorage，这些在data:或file:下全部失效
嵌套框架的本质是独立文档上下文，它需要真实的、可寻址的 HTTP 资源地址 —— 这点没法妥协。
