Javascript 如何添加“类”；“离线”；如果使用service worker从缓存中显示页面，则返回到正文

我正在使用ServiceWorker开发一个进步的web应用程序，每件事都很完美。现在，如果页面是从缓存提供的，我想隐藏页面上的一些内容，所以我需要将类“offline”添加到主体中

请告诉我如何添加document.body.classList.add（“脱机”）在下面的代码中

//Fetch from network failed
var fallback = function() {
    if (event.request.headers.get('Accept').indexOf('text/html') != -1) {
        return caches.match(event.request).then(function (response) {


            // need to return the response and add class "offline" to the body here
            return response || caches.match('offline-page.html');


        })
    } 
}

---

如果我做错了，请告诉我正确的方法。

我不确定您是否可以篡改缓存响应的内容。但我有另一个解决办法

navigator.onLine

是HTML5 API，可以帮助您检测浏览器的在线/离线状态。您可以将这段代码放在页面中：

window.addEventListener（'load'，（）=>{
如果（！navigator.onLine）document.body.classList.add（“脱机”）；
}，错）

我的目的是在向用户显示页面内容之前将其从页面中删除。你的解决方案看起来不错，你能告诉我这是一种更有效的方法吗？@Syed我会说我的解决方案是有效的。至于“高效”，你的意思是什么？我的解决方案可能会在加载完成之前将隐藏的内容刷新。但是这个问题可以通过先包含

离线

类名，然后在

navigator.onLine===true

时将其删除来解决。很遗憾，我不熟悉

响应

界面。我无法回答如何使用该接口直接修改缓存的HTML内容。