allowfullscreen 是唯一启用 iframe 全屏的合法属性，必须显式声明；跨域时需通过 fullscreenchange 事件判断状态；全屏请求须由 iframe 内用户手势触发，父页面不可代劳。
allowfullscreen 属性必须显式声明，且不能写成 allow="fullscreen"
浏览器默认禁止 iframe 内容触发全屏，allowfullscreen 是唯一有效的开启方式。它是个无值布尔属性，写成 allowfullscreen="true" 也合法，但 allow="fullscreen" 是错的——这是 sandbox 属性的语法，对全屏权限完全无效。常见错误是把两者混淆，导致 DevTools 里看到属性存在，实际却没生效。
验证是否真正启用：在 Chrome Elements 面板中右键 iframe → “Inspect iframe” → 切到右侧 “Permissions” 标签页，确认 fullscreen 显示为 “Allowed”。仅靠 HTML 里写了属性，不代表策略已落地。
跨域 iframe 下 contentWindow.document.fullscreenEnabled 总是 undefined
同源时你可以直接读取 document.querySelector('iframe').contentWindow.document.fullscreenEnabled；但只要跨域，这个访问就会被同源策略拦截，返回 undefined 或抛出 SecurityError。此时别硬查子页面状态，改用父页面监听 fullscreenchange 事件 + 检查 document.fullscreenElement 是否等于该 iframe 元素本身：
document.addEventListener('fullscreenchange', () => { if (document.fullscreenElement === document.getElementById('myIframe')) { /* 真正进入全屏 */ } });
这是唯一可靠的跨域全屏状态判断方式。
立即学习“前端免费学习笔记（深入）”；
全屏请求必须由 iframe 内部的用户手势触发
哪怕父页面和 iframe 都配好了 allowfullscreen，且同源，如果用父页面按钮调用 iframe.contentWindow.requestFullscreen()，现代浏览器（Chrome 90+、Firefox 88+）会直接拒绝，控制台报 Uncaught (in promise) TypeError: fullscreen error。
正确做法只有两种：
- 子页面自己提供一个按钮，点击时调用
element.requestFullscreen()（比如子页面里一个 div 或 canvas） - 父页面通过
postMessage发送指令，子页面收到后，在自己的 click handler 里执行 requestFullscreen —— 注意不能异步延迟，必须紧贴用户操作上下文
这个限制不是 bug，而是浏览器强制的 UX 安全策略：防止恶意页面静默劫持用户屏幕。
screenfull.js 等封装库不改变底层权限模型
screenfull 只是对 requestFullscreen 的 polyfill 和事件包装，它不会绕过 allowfullscreen 检查，也不会突破跨域限制。如果你用它操作 iframe 内容失败，问题一定出在权限配置或触发时机上，而不是库本身。
调试时直接跳过库，用原生 API 测试更高效：
- 先确认 iframe 有
allowfullscreen - 再确认子页面里某个元素能成功调用
.requestFullscreen() - 最后才把逻辑交给
screenfull
最容易被忽略的点：全屏入口必须在 iframe 自身 DOM 内完成交互闭环，父页面只能协调，不能代劳。
