JavaScript-页面全屏 requestFullscreen 和 exitFullscreen

页面全屏 requestFullscreen 和 exitFullscreen

1. requestFullscreen 相关的 api 在元素上，exitFullscreen 相关的 api 在 decument 上
2. 使用 any 是因为 ts 不能识别添加前缀的 api
3. 全屏是整个电脑显示区的大小，不是浏览器窗口的大小，当浏览器窗口不占据整个电脑屏幕的时候，此时的页面全屏会强制占据整个电脑屏幕

1. 开启全屏

const div = document.getElementById('div') as any
if (div.requestFullscreen) {
  div.requestFullscreen()
} else if (div.msRequestFullscreen) {
  div.msRequestFullscreen()
} else if (div.mozRequestFullScreen) {
  div.mozRequestFullScreen()
} else if (div.webkitRequestFullScreen) {
  div.webkitRequestFullScreen()
}

2. 关闭全屏

const doc = document as any
if (doc.exitFullscreen) {
  doc.exitFullscreen()
} else if (doc.msExitFullscreen) {
  doc.msExitFullscreen()
} else if (doc.mozCancelFullScreen) {
  doc.mozCancelFullScreen()
} else if (doc.webkitCancelFullScreen) {
  doc.webkitCancelFullScreen()
}