## PageVisibility
**1、PageVibility**
PageVisibility API是用于判斷頁(yè)面是否處于瀏覽器的當(dāng)前窗口,即是否可見(jiàn)。
這API是部署在`document`對(duì)象上的。
**1.1 屬性**
它有兩個(gè)屬性:
- `document.hidden`:返回一個(gè)布爾值,表示當(dāng)前是否被隱藏,只讀
- `document.visibilityState`:只讀,表示頁(yè)面當(dāng)前的狀態(tài),有四個(gè)可能值:`visibile`(頁(yè)面可見(jiàn))、`hidden`(頁(yè)面不可見(jiàn))、`prerender`(頁(yè)面正處于渲染之中,不可見(jiàn))、`unloaded`(如果文檔被卸載了)
在使用這兩個(gè)屬性時(shí),要加上不同瀏覽器的私有前綴:
獲取`hidden`屬性值:
```
function getHiddenProp() {
var prefixes = ['webkit', 'moz', 'ms', 'o'];
if ( 'hidden' in document) return 'hidden;
for(var i = 0; i < prefixes.length; i++) {
var hidden = prefixes[i] + 'Hidden';
if( hidden in document) {
return hidden;
}
};
return null;
}
```
獲取`visibilityState`屬性
```
function getVisibilityState() {
var prefixes = ['webkit', 'moz', 'ms', 'o'];
if ( 'visibilityState' in document) return 'visibilityState;
for(var i = 0; i < prefixes.length; i++) {
var visibilityState = prefixes[i] + 'VisibilityState';
if( hidden in document) {
return visibilityState;
}
};
return null;
}
```
**1.2 事件**
當(dāng)頁(yè)面的可見(jiàn)狀態(tài)發(fā)生變化時(shí),會(huì)觸發(fā)`visibilityChange`事件(也是需要加上私有前綴)
```
var hidden = getHiddenProp();
var visibilityChange = hidden.split(/[H|h]/, '')[0] + 'visibilitychange';
document.addEventListener(visibilityChange, function(){
console.log( document[getVisibilityState] );
});
```
- 前言
- JavaScript簡(jiǎn)介
- 基本概念
- 語(yǔ)法
- 數(shù)據(jù)類(lèi)型
- 運(yùn)算符
- 表達(dá)式
- 語(yǔ)句
- 對(duì)象
- 數(shù)組
- 函數(shù)
- 引用類(lèi)型(對(duì)象)
- Object對(duì)象
- Array對(duì)象
- Date對(duì)象
- RegExp對(duì)象
- 基本包裝類(lèi)型(Boolean、Number、String)
- 單體內(nèi)置對(duì)象(Global、Math)
- console對(duì)象
- DOM
- DOM-屬性和CSS
- BOM
- Event 事件
- 正則表達(dá)式
- JSON
- AJAX
- 表單和富文本編輯器
- 表單
- 富文本編輯器
- canvas
- 離線應(yīng)用
- 客戶端存儲(chǔ)(Cookie、Storage、IndexedDB)
- HTML5 API
- Video/Audio
- Geolocation API
- requestAnimationFrame
- File API
- FullScreen API
- IndexedDB
- 檢測(cè)設(shè)備方向
- Blob
- vibrate
- Luminosity API
- WebRTC
- Page Visibility API
- Performance API
- Web Speech
- Notification
- 面向?qū)ο蟮某绦蛟O(shè)計(jì)
- 概述
- this關(guān)鍵字
- 原型鏈
- 作用域
- 常用API合集
- SVG
- 錯(cuò)誤處理機(jī)制
- JavaScript開(kāi)發(fā)技巧合集
- 編程風(fēng)格
- 垃圾回收機(jī)制
