visibilitychange事件是浏览器的新事件方法，主要是用来监听页面是否处于显示状态，现在主流的浏览器都支持此事件，当浏览器进行切换选项卡、最小化、最大化、锁屏等操作的时候会主动触发该事件。
具体使用场景有：
1.网站有图片轮播效果，只有在用户观看轮播的时候，才会自动展示下一张幻灯片。
2.显示信息仪表盘的应用程序不希望在页面不可见时轮询服务器进行更新。
3.页面想要检测是否正在渲染，以便可以准确的计算网页浏览量（埋点使用场景）。
4.当设备进入待机模式时，网站想要关闭设备声音（用户按下电源键关闭屏幕）。
该API的属性和事件：
HTML5中专门为document元素添加了相关属性和事件：
1、Document.hidden 只读属性 布尔值 简单的表示标签页显示或者隐藏
如果页面处于被认为是对用户隐藏状态时返回true，否则返回false。
2、Document.visibilityState 只读属性
是一个用来展示文档可见性状态的字符串,可能的值：
visible: 页面内容至少是部分可见。 在实际中，这意味着页面是非最小化窗口的前景选项卡。
hidden : 页面内容对用户不可见。 在实际中，这意味着文档可以是一个后台标签，或是最小化窗口的一部分，或是在操作系统锁屏激活的状态下。
prerender : 页面内容正在被预渲染且对用户是不可见的(被document.hidden当做隐藏). 文档可能初始状态为prerender，但绝不会从其它值转为该值。 注释：浏览器支持是可选的。
unloaded : 页面正在从内存中卸载。 注释：浏览器支持是可选的。
3、Document.onvisibilitychange
EventListener 提供在visibilitychange 事件被触发时要调用的代码。
使用示例：
// 给document绑定一个visibilitychange事件，当前页面显示或者隐藏的时候执行该事件
document.addEventListener("visibilitychange", function() {
// 判断当前document是显示状态还是隐藏状态
if(!document.hidden){
// 如果是显示状态执行相应的事件
}else{
// 如果是隐藏状态执行相应的事件
}
});