[TOC] PageVisibility API用于判斷頁面是否處于瀏覽器的當前窗口，即是否可見。 使用這個API，可以幫助開發者根據用戶行為調整程序。比如，如果頁面處于當前窗口，可以讓程序每隔15秒向服務器請求數據；如果不處于當前窗口，則讓程序每隔幾分鐘請求一次數據。 ## 屬性 這個API部署在document對象上，提供以下兩個屬性。 * document.hidden：返回一個布爾值，表示當前是否被隱藏。 * document.visibilityState：表示頁面當前的狀態，可以取三個值，分別是visibile（頁面可見）、hidden（頁面不可見）、prerender（頁面正處于渲染之中，不可見）。 這兩個屬性都帶有瀏覽器前綴。使用的時候，必須進行前綴識別。 ~~~ function getHiddenProp(){ var prefixes = ['webkit','moz','ms','o']; // if 'hidden' is natively supported just return it if ('hidden' in document) return 'hidden'; // otherwise loop over all the known prefixes until we find one for (var i = 0; i < prefixes.length; i++){ if ((prefixes[i] + 'Hidden') in document) return prefixes[i] + 'Hidden'; } // otherwise it's not supported return null; } ~~~ ## VisibilityChange事件 當頁面的可見狀態發生變化時，會觸發VisibilityChange事件（帶有瀏覽器前綴）。 ~~~ document.addEventListener("visibilitychange", function() { console.log( document.visibilityState ); }); ~~~ ## 參考鏈接 * W3草案：[http://www.w3.org/TR/page-visibility/](http://www.w3.org/TR/page-visibility/) * David Walsh,?[Page Visibility API](http://davidwalsh.name/page-visibility) * Joe Marini,?[Using the pageVisbility API](http://www.html5rocks.com/en/tutorials/pagevisibility/intro/) * Jatinder Mann,?[Using PC Hardware more efficiently in HTML5: New Web Performance APIs, Part 2](http://blogs.msdn.com/b/ie/archive/2011/07/08/using-pc-hardware-more-efficiently-in-html5-new-web-performance-apis-part-2.aspx)