如何使用本地存储？答案

【问题标题】：How to use localStorage?如何使用本地存储？
【发布时间】：2021-09-17 06:21:47
【问题描述】：

我的本地实验的管理面板有一个“夜间模式”开关，在打开它之后 - 将管理面板的常规样式更改为夜间模式样式。下面是脚本的简化版本。如何正确使用 localStorage JavaScript 属性来存储当前的夜间模式设置？

function nightmode() {
    let nbtn = document.getElementById("nightmode");
    let head = document.getElementById("header");
    let cont = document.getElementById("content");
    
    cont.classList.toggle("nightmode");
    
    if(nbtn.innerHTML === "<span><i class=\"fa fa-sun-o\"></i></span>") {
        nbtn.innerHTML = "<span><i class=\"fa fa-moon-o\"></i></span>";
        head.style.cssText = "background-color:black; border-color:black; box-shadow:0 0 10px #000;";
    } else {
        nbtn.innerHTML = "<span><i class=\"fa fa-sun-o\"></i></span>";
        head.style.cssText = "background-color:none; border-color:none; box-shadow:none;";
    }
}

到目前为止我还没有运气。

【问题讨论】：

标签： javascript cookies local-storage

【解决方案1】：

您可以使用localStorage.setItem('nightMode', true); 设置键值对。

您可以使用localStorage.getItem(nightMode); 来获取密钥的值。
您可以使用 const nightModeBool = localStorage.getItem('nightMode');
将其存储到变量中要从本地存储中删除项目，请使用 localStorage.removeItem('nightMode');
要清除本地存储，请使用localStorage.clear();

您设置的 cookie 无法从其他网站或 URL 访问，只能从设置 cookie 的站点访问。

更多详情：MDN Reference

【讨论】：