JavaScript全屏功能依赖Fullscreen API，须由用户手势触发；调用element.requestFullscreen()进入全屏，document.exitFullscreen()退出；通过document.fullscreenElement检测状态，并监听fullscreenchange事件响应变化。
JavaScript 实现全屏功能主要依靠浏览器提供的 Fullscreen API，它允许网页元素（如视频、画布或整个 body）进入和退出全屏模式。注意：该操作必须由用户手势（如点击、按键）触发，不能自动执行，否则会被浏览器拒绝。
如何进入全屏
调用目标元素的 requestFullscreen() 方法即可尝试进入全屏。现代浏览器基本支持，但需注意兼容性前缀（旧版 Chrome/Safari 用 webkitRequestFullscreen，Firefox 早期用 mozRequestFullScreen）。
- 推荐写法：使用
Element.requestFullscreen()（标准方法），并做简单错误处理 - 只能对 document 中已挂载的元素调用，且该元素需满足“可全屏”条件（例如不是 iframe 内嵌页，除非设置了
allowfullscreen） - 常见目标：常用
document.documentElement（即 <html> 元素）来让整个页面进入全屏
示例代码：
function enterFullscreen() {
const elem = document.documentElement;
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
}
}
// 绑定到按钮点击
document.getElementById('fs-btn').addEventListener('click', enterFullscreen);
如何检测是否处于全屏状态
通过 document.fullscreenElement 判断：若为非 null，表示当前有元素处于全屏；值为实际全屏的 DOM 元素。
Java注释规范Skills
下载
当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式，或要求按照代码注释规范处理 Java 文件时，使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则，并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括：补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。
立即学习“Java免费学习笔记（深入）”；
-
document.fullscreenElement === null表示未全屏 - 也可监听
fullscreenchange事件，响应式更新 UI（如切换“退出全屏”按钮文字） - 注意：该属性名在部分旧浏览器中带前缀，如
webkitIsFullScreen、mozFullScreenElement，但现代开发中优先使用标准属性
如何退出全屏
调用 document.exitFullscreen() 即可退出当前全屏状态。同样需兼容旧版本：
- 标准方法：
document.exitFullscreen() - 旧版 Chrome/Safari：
document.webkitExitFullscreen() - 旧版 Firefox：
document.mozCancelFullScreen() - 旧版 IE/Edge：
document.msExitFullscreen()
示例：
function exitFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
}
注意事项与最佳实践
全屏 API 受安全策略限制较多，实际使用中需留意：
- 必须由用户主动触发（如 click、touchend），脚本直接调用会抛出
TypeError - 移动端支持有限：iOS Safari 不支持除 <video> 外的任意元素全屏；Android Chrome 支持较好
- 全屏时页面缩放、滚动、焦点行为可能变化，建议配合
fullscreenchange更新样式或逻辑 - 退出全屏后，
document.fullscreenElement变为null，可借此清理状态
