浏览器本地存储，localStorage

　　一般不会用到这个浏览器的本地存储，项目中的数据一般都会存在后台的数据库中，需要时，则由前台进行请求获取。不过有些情况下不得不使用这个 localStorage 来做保存操作。比如绘制的图像数据，请求后台返回数据进行绘制，这时需要将之前请求的绘制图片数据进行保留，以便方便对比，而将之前请求绘制的图片数据放入数据库中保存很不方便，而且频繁切换或者数据量大时，会造成性能问题，这样是不合要求的，那怎么解决此类问题呢？想到了利用浏览器本地存储的方式，只要不清除历史记录，本地历史会一直保存，这样就会很方便的通过 api 来获取想要的数据，大大简化了与后台数据请求的此数，减少了其工作量等。

　　这里记录下操作的相关 api，常用的几个异常简单，可以把浏览器存储当成是一个巨大的对象来使用，不过由浏览器要求，记着是 IE9 以上，其他浏览器貌似都是支持的。

复制代码
<!DOCTYPE html>
<html >
    <head>
        <meta charset='utf-8'>
    </head>
    <body >
        <script language="JavaScript">
        　　 console.log(localStorage.a)
            if(window.localStorage){
                alert(1)
                localStorage.a = 3
                var b = localStorage.a
                console.log(b);
            }else{
                alert(0)
            }
            console.log(localStorage.localObj);
            var obj = {name: 'ice'}
            localStorage.localObj = JSON.stringify(obj);
            console.log(localStorage.localObj);

            localStorage.clear();
        
            console.log(localStorage.localObj);
        </script>
    </body>
</html>
复制代码

　　首先需要判断存不存在本地存储，再使用。

　　然后就是类似对象的调用一样，直接存储使用即可。

　　有的时候数据很多，建议先将数据转成 json 串，再进行存储，因为对象或数组，它有字节限制，超出后的部分会被丢弃，所以转成 json 完全无问题，获取的时候还需要反转成对象或数组哦别忘了！

　　还有个清除所有存储的 api ：localStorage.clear();

　　会全部清除哦，谨慎使用~

posted @   名字不好起啊  阅读(1536)  评论(0)  编辑  收藏  举报
编辑推荐：
· AI与.NET技术实操系列：基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
阅读排行：
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型，支持深度思考和联网搜索！
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· ollama系列01：轻松3步本地部署deepseek，普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示
AI IDE Trae