js 判断 是否在当前页面 当前页面是否在前端

Posted 草木物语

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js 判断 是否在当前页面 当前页面是否在前端相关的知识,希望对你有一定的参考价值。

 

1.使用visibilitychange

浏览器标签页被隐藏或显示的时候会触发visibilitychange事件.

document.addEventListener("visibilitychange", function() {
    console.log(document.visibilityState);
    if(document.visibilityState == "hidden") {
        console.log(‘隐藏‘);
    } else if (document.visibilityState == "visible") {
        console.log(‘显示‘)
    }
});

 

2.使用onblur 和 onfocus

通过获取失去焦点判断页面是否在最前端

var count = 1;
var interval_output = null;
     
function output_number() {
    document.body.innerhtml += (count + " ");
    count++;
}
     
// window 失去焦点,停止输出
window.onblur = function() {
    clearInterval(interval_output);
};
     
// window 每次获得焦点
window.onfocus = function() {
    // 每 1 秒在页面输出一个数
    interval_output = setInterval(function() {
        output_number();
    }, 1000);
}

 

参考地址: https://zhidao.baidu.com/question/541794991.html

https://developer.mozilla.org/zh-CN/docs/Web/Events/visibilitychange

以上是关于js 判断 是否在当前页面 当前页面是否在前端的主要内容,如果未能解决你的问题,请参考以下文章

[JS] js 判断用户是否在浏览当前页面

js 如何判断一个已打开的页面是不是存在??

32.js 判断当前页面是否被浏览

js 怎样判断用户是不是在浏览当前页面?

js如何实现父窗口前端显示,如果父窗口关闭则重新打开

判断当前页面是否在微信浏览器中打开(四类方法整理)