我尝试在普通JavaScript的帮助下制作一个Timer，并使用Timeout Function每毫秒更新一次定时器，但在启动它之后，如果我切换到当前浏览器之外的另一个应用程序，Timeout函数将停止执行它。如果我离开窗口焦点8秒钟，几秒钟后又回到浏览器，计时器将从8秒钟开始继续。我希望它即使在后台也能连续运行。
我也认为这可能会有所帮助，但我不知道如何实现这一点——https://www.w3schools.com/js/js_api_web_workers.asp
是的，所有现代浏览器在设计时都不允许JS执行，如果选项卡没有聚焦，这是出于优化目的而设计的。
即使选项卡失去焦点，您也可以使用worker使代码仍然可以运行，但worker不允许访问DOM，因此您无法在页面上进行任何可见的更新。
下面是一个简单的例子：index.html
<!DOCTYPE html>
<html>
<body>
<button onclick="startWorker()">Start Worker</button>
<button onclick="stopWorker()">Stop Worker</button>
<script>
let w;
function startWorker() {
if (typeof(Worker) !== "undefined") {
if (typeof(w) == "undefined") {
w = new Worker("webWorker.js");
}
}
}
function stopWorker() {
w.terminate();
w = undefined;
}
</script>
</body>
</html>
webWorker.js
let max = 0
let consoleLogWorker = () => {
console.log("background log")
max+= 1
if(max < 50) setTimeout("consoleLogWorker()",500);
}
consoleLogWorker();
如果运行上面的示例，您将看到，一旦启动工作程序，即使您离开启动工作程序的页面，它仍将在控制台中打印。
但是同样，您不能直接访问web worker中的DOM。
你应该尝试使用Via.js，它可以让你访问工作程序"内部"的DOM，这在过去不是一个可行的解决方案，因为它会造成内存泄漏，但WeakRef在Chrome 84+中默认启用，所以它不应该在新的浏览器上造成内存泄漏。
我使用via创建了一个chrome扩展，在后台设置计时器，然后使用网络工作者更改网站的图标https://gitlab.flashsoft.eu/chrome-extensions/tab-timer-alert也许它会对你有所帮助。