iframe 不是隐藏域，与 input type="hidden" 无关；它作为独立浏览上下文承载 HTML 响应，不参与表单数据提交，仅通过 name 与 form.target 匹配实现无刷新提交。
iframe 不是隐藏域，它和 <input type="hidden"> 完全无关；把它当“隐藏域”用，是混淆概念导致后续所有问题的根源。
为什么不能把 iframe 当作 hidden input 来理解
隐藏域（<input type="hidden">）的作用是向服务端传递预设值，它参与表单序列化、随 POST 数据一起发出去；而 <iframe> 是一个独立的浏览上下文，只负责承载服务端返回的 HTML 响应——它不传数据，也不收集字段。
常见错误包括：在 form 里写 <iframe name="target-frame"></iframe> 却误以为这个 iframe 会自动把某个变量“藏进去”提交；或试图给 iframe 设置 value 属性，结果发现根本无效。
-
<input type="hidden">必须有name和value才会被提交，缺一不可 -
<iframe>必须有name才能被form.target指向，但它没有value、不参与表单数据组装 - 两者 DOM 位置也不同：
input必须在<form>内部；iframe只需同级或前置，不能嵌套在form标签内（部分浏览器会重置其contentWindow）
iframe.name 和 form.target 必须严格一致才生效
这是整个机制能跑起来的唯一前提。大小写、空格、引号包裹与否，全部影响匹配结果。
立即学习“前端免费学习笔记（深入）”；
浏览器不会报错提示“target 找不到 iframe”，而是静默回退到默认行为：整页跳转或刷新。你看到页面白一下、地址栏变了，大概率就是这个原因。
- ✅ 正确：
<iframe name="upload-frame"></iframe>+<form target="upload-frame"> - ❌ 错误：
<iframe id="upload-frame"></iframe>（只有id，没name） - ❌ 错误：
<form target=" Upload-frame ">（前后空格、大小写不一致） - ❌ 错误：
<iframe name="upload-frame" src="about:blank"></iframe>（src="about:blank"在 Chrome 92+ 可能触发提交失败）
服务端响应必须是完整 HTML，且可被 iframe 渲染
iframe 只渲染 text/html，不是 JSON、不是纯文本、不是 XML。返回非 HTML 内容时，浏览器要么显示原始字符串（如 {"ok":true}），要么空白，且不触发 load 事件。
即使内容只是通知父页，也要包裹在合法 HTML 结构中，并声明 charset，否则旧版 IE 或中文环境可能乱码甚至拒绝解析。
- 最小可用响应体示例：
<html><head><meta charset="utf-8"></head><body><script>window.parent.postMessage({success:true}, "*");</script></body></html> - Content-Type 响应头必须为
text/html; charset=utf-8，不能是application/json或未声明 charset 的text/html - 避免直接
echo $_POST['xxx']等用户输入进 script 标签——这是典型 XSS 入口 - 如果后端无法输出 HTML，至少用
<pre>包裹 JSON 字符串，并在前端用JSON.parse(iframe.contentDocument.body.textContent.trim())解析
读取 iframe 响应内容必须等 load 事件，且做同源判断
submit() 调用完立刻访问 iframe.contentDocument，99% 概率拿到 null 或 SecurityError。这不是时机问题，是浏览器规范：内容未加载完成，DOM 就不可读。
更麻烦的是，跨域响应下 contentDocument 和 contentWindow.document 均不可访问，此时唯一通信方式只有服务端主动调用 window.parent 或发 postMessage。
- 绑定
iframe.onload必须在form.submit()之前完成，动态创建的 iframe 尤其要注意顺序 - 回调中先检查
iframe.contentDocument && iframe.contentDocument.body是否存在，再读textContent - 同域下可安全读取；跨域下只能依赖
postMessage，且父页需用event.source === iframe.contentWindow校验来源 - IE11 建议 fallback 到
iframe.contentWindow.document，Safari iOS 15+ 建议加error事件监听 + 30s 超时兜底
真正难的不是写对那几行 HTML，而是理清「谁在什么时候、以什么权限、访问哪一部分内容」——表单提交、iframe 加载、脚本执行、跨域限制、CSP 策略，这五层叠加下来，漏掉任意一环都会表现为“iframe 空白”或“收不到回调”。
