JavaScript使浏览器全屏代码及注意事项

function enterFullscreen() {
    var elem = document.documentElement; // 获取文档的根元素
    if (elem.requestFullscreen) {
        elem.requestFullscreen(); // 标准方法
    } else if (elem.mozRequestFullScreen) { /* Firefox */
        elem.mozRequestFullScreen();
    } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
        elem.webkitRequestFullscreen();
    } else if (elem.msRequestFullscreen) { /* IE/Edge */
        elem.msRequestFullscreen();
    }
}

function exitFullscreen() {
    if (document.exitFullscreen) {
        document.exitFullscreen(); // 标准方法
    } else if (document.mozCancelFullScreen) { /* Firefox */
        document.mozCancelFullScreen();
    } else if (document.webkitExitFullscreen) { /* Chrome, Safari and Opera */
        document.webkitExitFullscreen();
    } else if (document.msExitFullscreen) { /* IE/Edge */
        document.msExitFullscreen();
    }
}

function onFullScreenChange() {
    if (!document.fullscreenElement) {
        console.log('Exited full screen');
    } else {
        console.log('Entered full screen');
    }
}

document.addEventListener('fullscreenchange', onFullScreenChange); // 标准事件名，适用于所有主流浏览器，除了Safari。Safari使用'webkitfullscreenchange'。
document.addEventListener('webkitfullscreenchange', onFullScreenChange); // Safari专用