JavaScript 实现谷歌浏览器 F11 全屏功能

实现谷歌浏览器 F11 功能可以使用 JavaScript 中的全屏 API，以下是一个简单的实现示例：

// 检测当前是否是全屏状态
function isFullscreen() {
  return (
    document.fullscreenElement ||
    document.mozFullScreenElement ||
    document.webkitFullscreenElement ||
    document.msFullscreenElement
  );
}

// 进入全屏
function enterFullscreen() {
  const element = document.documentElement;
  if (element.requestFullscreen) {
    element.requestFullscreen();
  } else if (element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if (element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if (element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}

// 退出全屏
function exitFullscreen() {
  if (document.exitFullscreen) {
    document.exitFullscreen();
  } else if (document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if (document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  } else if (document.msExitFullscreen) {
    document.msExitFullscreen();
  }
}

// 监听键盘事件，按下 F11 键切换全屏状态
document.addEventListener('keydown', function(event) {
  if (event.key === 'F11') {
    if (isFullscreen()) {
      exitFullscreen();
    } else {
      enterFullscreen();
    }
  }
});

此代码通过检测键盘事件，当按下 F11 键时切换全屏状态。进入全屏使用requestFullscreen()方法，退出全屏使用exitFullscreen()方法。请注意，全屏 API 在不同浏览器中的名称可能略有不同，因此代码中使用了多个前缀进行兼容处理。