資訊專欄INFORMATION COLUMN
摘要：所有屬性兩個屬性，一個方法只讀返回一個布爾值，顯示當前頁面是否不可見。可能的值頁面內容至少是部分可見。在實際中，這意味著頁面是非最小化窗口的前景選項卡。注釋瀏覽器支持是可選的頁面狀態切換時的事件。參考資料張鑫旭博客頁面可見性介紹微拓展
今天在知乎上看到一篇文章，說到了用window.blur 和 window.focus事件來動態改變網頁的title, Page Visibility這么強大的功能只能懷才不遇
Page Visibility API在使用瀏覽器的時，用戶常常是打開多個網頁，當一個網頁是可見或點擊選中的狀態時 Page Visibility API 可以讓你獲取到這種狀態。Page Visibility做的事情很簡單，就是判斷頁面是否課件。
Page Visibility 所有屬性兩個屬性，一個方法
document.hidden(只讀)
返回一個布爾值，顯示當前頁面是否不可見。
document.visibilityState (只讀)
是一個用來展示文檔可見性狀態的字符串。可能的值：
visible : 頁面內容至少是部分可見。 在實際中，這意味著頁面是非最小化窗口的前景選項卡。
hidden : 頁面內容對用戶不可見。 在實際中，這意味著文檔可以是一個后臺標簽，或是最小化窗口的一部分，或是在操作系統鎖屏激活的狀態下。
prerender : 頁面內容正在被預渲染且對用戶是不可見的(被document.hidden當做隱藏). 文檔可能初始狀態為prerender，但絕不會從其它值轉為該值。 注釋：瀏覽器支持是可選的。
unloaded : 頁面正在從內存中卸載。 注釋：瀏覽器支持是可選的
visibilitychange 頁面狀態切換時的事件。
和focus、blur事件的一些區別。focus、blur會在點擊地址欄，書簽時觸發。Visibility不會觸發
多窗口模式下，Visibility不會觸發。
頁面直接最小化，focus、blur和Visibility正常觸發。
牢記定義： 文檔是一個后臺標簽，或是最小化窗口的一部分，或是在操作系統鎖屏激活的狀態下。
應用場景使用 Visibility可以節省資源，當頁面不可見的時候，就可以讓頁面休息休息了，一些動畫也可以暫停，或者播放的視頻暫停，非常貼心。
或者一個打開一個站點多個頁面，在其中一個頁面登錄，切換到其它頁面的時候就可以自動登錄。
兼容性經過了幾年的發展，現在Page Visibility API 的兼容性已經非常良好，可以放心使用。
張鑫旭博客Page Visibility(頁面可見性) API介紹、微拓展
MDN Page_Visibility_API
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82879.html
摘要：原文譯文的頁面可視性譯者在早期，瀏覽器并沒有提供選項卡，但是現在基本所有瀏覽器都提供了這個功能。在這個中，將基于頁面的可視性狀態彈出文檔的標題。對于常見的手風情效果，當頁面不可見時，可以限制其移動。 原文：HTML5 Page Visibility API 譯文：HTML 5的頁面可視性API 譯者：dwqs showImg(https://segmentfault.com/im...
一、簡介 要知道用戶何時離開，有常用的方法是監聽下面三個事件。 pagehide beforeunload unload 可上述三種方法有一個bug就是，這些事件在手機上可能不會觸發，頁面就直接關閉了。因為手機系統可以將一個進程直接轉入后臺，然后殺死。 用戶點擊了一條系統通知，切換到另一個 App。 用戶進入任務切換窗口，切換到另一個 App。 用戶點擊了 Home 按鈕，切換...
閱讀 1341·2023-04-25 23:42
閱讀 2808·2021-11-19 09:40
閱讀 3520·2021-10-19 11:44
閱讀 3529·2021-10-14 09:42
閱讀 1860·2021-10-13 09:39
閱讀 3821·2021-09-22 15:43
閱讀 665·2019-08-30 15:54
閱讀 1448·2019-08-26 13:32
