JS monitorea la visualización y ocultación de las pestañas del navegador
API
-
document.hidden
es un valor booleano que determina si la página está oculta. La ocultación de páginas incluye páginas en pestañas en segundo plano o navegadores minimizados -
document.visibilityState
(propiedad de solo lectura), devuelve la visibilidad del documento, 4 valores:
oculto: el documento está en la pestaña de fondo o la ventana está minimizada, o el sistema operativo está en el 'estado de pantalla de bloqueo'visible: esta página está en la pestaña de primer plano y la ventana no está minimizada
prerender: la página realiza un renderizado previo fuera de la pantalla. El valor de document.hidden es verdadero.
descargado: La página se está descargando de la memoria.
-
evento de cambio de visibilidad
Este evento se activa cuando una pestaña cambia de visible a invisible o de invisible a visible (incluido el cambio de pestaña y la minimización del navegador).
document.addEventListener('visibilitychange', function() {
var isHidden = document.hidden;
console.log(document.visibilityState)
if (isHidden) {
document.title = '隐藏';
} else {
document.title = '显示';
}
});
Compatibilidad del navegador
Chrome (Webkit) Firefox (Gecko) Internet Explorer
33+(-webkit-) 56+(-moz-) 10+(-ms-)
Escena aplicable
Deje de reproducir videos musicales y encuestas innecesarias cuando la pestaña esté oculta