element.requestfullscreen调用失败主因是未在用户手势（如click）中触发，且元素需有尺寸、可见、已挂载；须检测标准/webkit方法、加.catch()处理，并用document.fullscreenelement和fullscreenchange监听状态。
element.requestFullscreen 调用失败的常见原因
直接调用 element.requestFullscreen() 大概率报错，浏览器会拒绝非用户手势触发的全屏请求。典型错误信息是 TypeError: Document not active 或 NotAllowedError: Fullscreen request was denied。这意味着：必须在 click、keydown（且 event.isTrusted === true）等真实用户交互回调中调用，不能放在 setTimeout、Promise.then 或页面加载完成时自动触发。
正确绑定全屏请求的 DOM 操作流程
以一个 <div id="player"> 为例，需确保：元素已挂载、有明确尺寸、未被 <code>display: none 或 visibility: hidden 隐藏，且调用时机严格限定在用户操作内：
- 给目标元素设置最小宽高（如
min-width: 300px; min-height: 200px），否则部分浏览器（尤其是 Safari）会静默拒绝 - 监听按钮的
click事件，而非mouseenter或自定义事件 - 调用前检查元素是否可全屏：
if (element.matches(':defined') && element.offsetParent !== null) - 捕获并处理 Promise 拒绝：
element.requestFullscreen().catch(e => console.error('FS failed:', e))
兼容性处理：不要只写 requestFullscreen()
虽然现代 Chrome/Firefox/Edge 已统一支持标准 requestFullscreen()，但 Safari 15.4–16.3 仍需 webkitRequestFullscreen()，且旧版 Android WebView 可能需要 mozRequestFullScreen（注意大小写）。实际建议：
- 优先检测标准方法：
if ('requestFullscreen' in element) - fallback 到
if ('webkitRequestFullscreen' in element)，再调用element.webkitRequestFullscreen() - 不推荐用
document.documentElement.requestFullscreen()替代——这会让整个页面全屏，不是“指定元素” - 避免封装成通用函数时漏掉
.catch()，否则失败无提示
退出全屏与状态监听不能只靠 document.fullscreenElement
document.fullscreenElement 是判断当前全屏元素的唯一可靠方式，但它只在全屏激活后才指向目标元素；退出时它变为 null。要注意：
- 监听
document.addEventListener('fullscreenchange', handler)，而不是fullscreenerror（该事件极少触发） - 在 handler 中通过
document.fullscreenElement === element确认是否是你的元素退出了 - 手动退出应调用
document.exitFullscreen()，而非element.exitFullscreen()（后者不存在） - 移动端 Safari 不支持
allow="fullscreen"外的 iframe 内全屏，嵌入视频时需额外加属性
video 元素的特殊限制（比如必须带 playsinline 才允许其调用 requestFullscreen）。
