HTML页面全屏的API

    Hello,各位的朋友大家好，这是我的第一个作品。很高兴可以在这里发布作品。我将把我在工作中get到的知识，分享到这里。希望能够帮助到大家。

    今天分享的知识是HTML页面中可以实现全屏的一个api。

        效果如下：

        话不多说，直接贴代码。

            首先我们需要一个按钮（icon图标之类的，总之可以绑定点击事件的东西)。

                点击切换全屏

            接下来就是他的回调函数

    methods:{

        // 全屏事件

        handleFullScreen() {

            let element = document.documentElement;

            if (this.fullscreen) {

                if (document.exitFullscreen) {

                    document.exitFullscreen();

                } else if (document.webkitCancelFullScreen) {

                    document.webkitCancelFullScreen();

                } else if (document.mozCancelFullScreen) {

                    document.mozCancelFullScreen();

                } else if (document.msExitFullscreen) {

                    document.msExitFullscreen();

                }

            } else {

                if (element.requestFullscreen) {

                    element.requestFullscreen();

                } else if (element.webkitRequestFullScreen) {

                    element.webkitRequestFullScreen();

                } else if (element.mozRequestFullScreen) {

                    element.mozRequestFullScreen();

                } else if (element.msRequestFullscreen) {

                    // IE11

                    element.msRequestFullscreen();

                }

            }

        }

  }

代码格式有点乱，实在是在页面上不好调，下次注意。如哪里有不合理的地方，请在下方评论出来，作者看到一定回复。