现代浏览器全屏需同时满足 allow="fullscreen"、子页用户手势触发、目标元素在子页DOM中等条件，allowfullscreen仅作兼容补丁。

allowfullscreen 属性本身不“失效”，而是权限链断在了更底层

加了 allowfullscreen 还不能全屏，不是属性“失效”了，而是现代浏览器（Chrome 120+、Firefox 100+、Safari 13.1+）已把全屏权限控制收归 allow="fullscreen"，allowfullscreen 只作兼容补丁。它单独存在时，在跨域 iframe 或新内核下根本不起作用。

• allowfullscreen 是布尔属性，写成 allowfullscreen="true" 或 allowfullscreen="1" 都是错的，必须无值或空字符串
• allow="fullscreen" 的值必须是精确字符串 "fullscreen"，拼成 "full-screen"、"allow-fullscreen"、"Fullscreen" 全无效
• 父页面响应头含 Permissions-Policy: fullscreen 'none' 会直接覆盖 HTML 属性，此时删响应头比改 iframe 更有效
• 若 iframe 带 sandbox，必须显式加 allow-scripts，否则子页 JS 根本不执行，requestFullscreen() 压根没机会被调用

跨域 iframe 必须双写 allow 属性，且触发点必须在子页内部

跨域 iframe 下，仅靠 allowfullscreen 不够，allow="fullscreen" 是硬性要求；但更关键的是：全屏请求必须由 iframe 内部的用户手势触发——父页按钮点击后调 iframe.contentWindow.document.documentElement.requestFullscreen() 永远失败。

使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审

使用经过文档化的设计技能，从真实的品牌或项目背景中生成HTML原生原型、幻灯片、动态演示、可视化图表和评审流程。

下载

• 正确做法：子页里放一个 ，而不是父页 proxy 调用
• 不能在 iframe.onload、setTimeout、fetch().then() 中调用，浏览器直接静默拒绝，不报错也不 resolve Promise
• 目标元素必须是子页中真实挂载的 DOM 节点（如
  ），不能是 自身，iframeElm.requestFullscreen() 永远返回 rejected Promise
• 验证是否就绪：在子页控制台执行 document.fullscreenEnabled，返回 true 才算通过权限检查

父页 document.fullscreenElement 永远为 null 是正常行为

别指望 parent.document.fullscreenElement === iframeElm 能判断子页是否全屏——这永远不成立。iframe 全屏后，全屏状态属于子文档（iframe.contentDocument），父文档的 document.fullscreenElement 始终为 null，哪怕整个视口都被占满。

• 正确通信方式：子页进入/退出全屏时，主动发 window.parent.postMessage({ type: 'FULLSCREEN_ENTERED' }, '*')
• 父页监听 window.addEventListener('message', handler)，根据消息更新 UI 或滚动锁等状态
• 不要依赖 document.fullscreenchange 事件来推断 iframe 状态，该事件只反映父文档自身全屏状态

iOS Safari 和 HarmonyOS ArkWeb 的特殊限制

iOS Safari 对非 元素全屏支持极严，普通

在 iOS 上基本无效；HarmonyOS ArkWeb 同样遵循 iframe 权限隔离机制，仅识别 allowfullscreen 和 allow="fullscreen"，但旧版还要求 webkitallowfullscreen 和 mozallowfullscreen 兜底。

• 实际部署建议统一写成：
• HTTPS 是底线：HTTP 页面嵌 HTTPS iframe 通常可全屏，但 HTTPS 页面嵌 HTTP iframe 会被现代浏览器直接阻断
• Bilibili / YouTube 官方 embed 地址默认带 allowfullscreen，但若你自定义 src（比如跳过首页跳转），必须手动补全所有 allow 属性

真正卡住人的，往往不是属性漏没漏，而是误以为“写了就能用”。allow="fullscreen" 是白名单入口，但后续每一步——子页 JS 是否运行、手势是否发生在 iframe 内、目标元素是否挂载、父页策略头是否覆盖——都可能无声截断全屏流程。调试时别只盯 HTML，先看子页控制台 document.fullscreenEnabled，再查 DevTools 的 Permissions 标签页，最后确认 postMessage 通路是否打通。