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