说明

Web 开发中一个常见的问题是开发者不知道用户什么时候真正在使用页面。

如果页面被最小化或隐 藏在其他标签页后面,那么轮询服务器或更新动画等功能可能就没有必要了。

Page Visibility API 旨在为 开发者提供页面对用户是否可见的信息。

属性和事件

状态

document.visibilityState 值,表示下面 4 种状态之一。
1、hidden:页面在后台标签页或浏览器中最小化了。
2、visible:页面在前台标签页中。
3、实际页面隐藏了,但对页面的预览是可见的(例如在 Windows 7 上,用户鼠标移到任务栏图标 上会显示网页预览)。
4、页面在屏外预渲染。

改变状态事件

visibilitychange 事件,该事件会在文档从隐藏变可见(或反之)时触发。

是否隐藏

document.hidden 布尔值,表示页面是否隐藏。这可能意味着页面在后台标签页或浏览器中被最小 化了。

这个值是为了向后兼容才继续被浏览器支持的,应该优先使用 document.visibilityState 检测页面可见性。