如何实现一个倒计时，切换浏览器 tab之后定时器不暂停，和 segmentfault 的倒计时验证一样？

Question

Answer 1

当浏览器最小化窗口或切换到另一个选项卡时就会触发visibilityChange事件，我们可以在事件中用document.hidden(true/false)或者document.visibilityState("visible"/"hidden")判断当前窗口的状态，来决定除定时器后者重新开始定时器

demo:

    let count = 0;
    let timer = null
    timer = setInterval(() => {
      console.log(count);
      count++
    }, 200)
    document.addEventListener("visibilitychange", function () {
      if (document.hidden === true) {// document.visibilityState == "visible"
        // 页面被挂起
        clearInterval(timer)
      } else {
        // 页面由挂起被激活
        timer = setInterval(() => {
          console.log(count);
          count++
        }, 200)
      }
    });

也可以这样:

https://juejin.cn/post/6985798073700057118

Answer 2

记录倒计时开始的时间，页面切换回来时获取当前时间，相减就是剩下的时间。