Javascript 使用js和/或Cookie保存切换的类状态？

我有一个横幅固定在我的网站底部，默认情况下是打开的，以显示重要信息，我还有一个按钮，可以切换它离开，如果用户已经阅读了通知，并希望隐藏它

这是我的js：

$(document).ready(function(){
    const   noticeToggle = document.querySelector('.notice__toggle'),
            notice = document.querySelector('.notice')

    noticeToggle.addEventListener('click', _ => {
        noticeToggle.classList.toggle('notice__toggle--toggled');
        notice.classList.toggle('notice--toggled');
    })
});

---

当用户在网站上时，我是否可以使用js、cookies或其他方法保存此切换的状态？目前，默认情况下，只有在浏览不同页面时才会打开（如预期的那样）。

您可以使用localStorage存储标志来确定标志的状态，如下所示：

document.addEventListener（'DOMContentLoaded'，（）=>{
const noticeToggle=document.querySelector（'.notice\uu toggle'），
notice=document.querySelector（“.notice”）
if（！！localStorage.getItem（'bannerdismited'））{
notice.classList.add（'notice--toggled'）；//删除横幅
}
注意切换.addEventListener（'click'，_=>{
noticeToggle.classList.toggle（'notice_utoggle--toggled'）；
toggle（'notice--toggled'）；
setItem（'bannerDismissed'，'true'）；
})
});

---

注意，我在示例代码中删除了对jQuery的依赖，因为它只用于文档加载事件处理程序。

只需保存开关状态，如

localStorage.setItem（'myWithState'，'active'）

---

当页面加载时获取它，比如

localStorage.getItem（'myWithState'）
您可以使用localStorage进行此操作

// write
window.localStorage.hasReadYourInfoBox = true;

// read
const hasReadInfoBox = !!window.localStorage.hasReadYourInfoBox

谢谢你的回答，效果很好，但我还有一个问题。是否可以仅在用户当前会话期间保存状态？横幅显示了经常更新的信息，我不希望任何人错过它，如果他们以前访问过该网站并隐藏了横幅。再次感谢您的帮助。当然，在这种情况下，请将用户在其浏览器设置中手动清除之前存储的
localStorage
更改为
sessionStorage
，会话结束时会自动清除该存储