重新加载页面后在 setInterval() 上节省时间？答案

【问题标题】：Save time left on setInterval() after reloading page?重新加载页面后在 setInterval() 上节省时间？
【发布时间】：2020-11-10 01:51:35
【问题描述】：

我正在制作一个本应作为休息场所的网页，所有 html 元素将在 5 分钟后隐藏并在 30 分钟后再次显示，但目前只需重新加载页面即可绕过此冷却时间。我打算尝试使用 localStorage.setItem()，但我不确定如何在间隔中剩余时间来保存或更新它。我的代码在这里。

<script>

var body = document.querySelector('body')
    
    setInterval(()=>{
        body.style.display = 'initial' ;
        setTimeout(()=>{
              body.style.display = 'none'
        }, 300000)
     }, 180000)


</script> 
<body>
<h1>example html</h1>

</body

【问题讨论】：

所以你必须使用本地存储。将结束时间存储在本地存储中。如果他们离开并回来，您读取 localstorage 并设置一个值
使用 javascript cookie，这意味着如果用户刷新页面，他们将获得相同时间的值。缺少的行是：document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
虽然有人可以删除本地存储
cookies可以被用户清除，会话也可以通过用户关闭浏览器来关闭。如果使用数据库你可以存储使用地址，他的初始时间（他进入你的页面的时间），之后可以使用他的初始时间来检查他的时间是否完成。

标签： javascript html variables cookies

【解决方案1】：

大概是这样的

const body = document.querySelector('body');
const aMinute = 60000;
let d = localStorage.getItem("d"); 
let now = new Date().getTime;
let end = d ? new Date(d) : new Date().getTime();
let tId = setInterval(()=>{
  now = new Date().getTime;
  body.classList.toggle("initial",now-end > 0);
}, 180000)
// some event to set
localStorage.setItem("d",(new Date().getTime()+5*aMinute));

<h1>example html</h1>

【讨论】：

那么这是代替我之前的代码，还是在它之后？
这只是一个想法 - 你可以使用点点滴滴
好的。不过，我对 javascript 还很陌生，所以这是我问的唯一原因。谢谢！