让页面全屏，这一点在大屏尤其有用，可以让网页铺满 1920*1080

    新 api 都要考虑兼容性。

    需要注意的是，全屏的是某一个元素，我们可以全屏一张图片、一段文字或者整个html，从实际情况来看 document.documentElement 也就是 整个 <html> 最有用，body 似乎会丢样式，也就是说希望这个元素能够自带样式，比如 video

    chrome 通用方法：

    1. const html = document.documentElement
    3. // 切换到全屏
    4. await document.documentElement.requestFullscreen()
    6. // 缩小为普通屏幕
    7. await document.exitFullscreen()
    9. // 能否全屏
    10. document.fullscreenEnabled === true
    12. // 当前是否出于全屏模式
    13. document.fullscreen === ture
    15. // 那个元素在全屏，比如让 H1 标签全屏了
    16. document.fullscreenElement === document.querySelector('h1')

    小技巧：

    1. javascript:async function toggleFullScreen(){
    3. document.fullscreen ? 
    4.   await document.exitFullscreen() :
    5.     await document.documentElement.requestFullscreen()
    6. }
    7. toggleFullScreen()

    MDN 上还介绍了一个简单包装库，用来兼容多浏览器，如果生产要兼容多浏览器可能需要关注。https://developer.mozilla.org/zh-CN/docs/Web/API/Fullscreen_API/Guide