web建站教程
  1. 首页
  2. vuejs
  3. js
  4. 好玩
  5. AIGC工具
  6. 前端知识
  7. 百度echarts
  8. 更多
    php入门
    nodejs
    mockjs
    reactjs
    mysql
    wordpress
    织梦cms
    帝国cms
    git教程
    IT知识
    模板大全
    休息站
    手机应用

前端如何利用localStorage方法写入/读取缓存

850 ℃

在做前端开发的时候会经常碰到需要前端自己存储缓存数据,这里我们就会用到localStorage方法的运用,下面web建站小编给大家爱简单介绍一下关于localStorage方法写入/读取。

localStorage方法写入

var storage=window.localStorage;
//方法一
storage["a"] = 1;
//方法二
storage.b = 2;
//方法三
storage.setItem("c",3);
console.log("输出类型:",typeof storage["a"]);
console.log("输出类型:",typeof storage["b"]);
console.log("输出类型:",typeof storage["c"]);

localStorage方法读取

var storage=window.localStorage;
//方法一
var a=storage.a;
console.log(a);

//方法二
var b=storage["b"];
console.log(b);

//方法三
var c=storage.getItem("c");
console.log(c);

拓展资料:

localStorage的优势:

1、localStorage拓展了cookie的4K限制;

2、localStorage会可以将第一次请求的数据直接存储到本地,这个相当于一个5M大小的针对于前端页面的数据库,相比于cookie可以节约带宽,但是这个却是只有在高版本的浏览器中才支持的。

localStorage的缺点:

1、浏览器的大小不统一,并且在IE8以上的IE版本才支持localStorage这个属性;

2、目前所有的浏览器中都会把localStorage的值类型限定为string类型,这个在对我们日常比较常见的JSON对象类型需要一些转换;

3、localStorage在浏览器的隐私模式下面是不可读取的;

4、localStorage本质上是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡;

5、localStorage不能被爬虫抓取到。

纯前端有哪些方法可以实现缓存

html5标签中有哪些离线存储方式

vue开发如何实现数据缓存

sessionStorage和localStorage基本操作方法介绍

localStorage如何实现记住浏览记录

标签: localStorage, 写入缓存, 读取缓存

上面是“前端如何利用localStorage方法写入/读取缓存”的全面内容,想了解更多关于 js 内容,请继续关注web建站教程。

当前网址:https://ipkd.cn/webs_3640.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

当前位置: 网站首页 > js
本文共计875个字,预计阅读时长6分钟
生活小工具,收录了80多款小工具
上一篇: 推荐2款充满科技感的艺术字体——小新黑体、小新潮酷体
下一篇: 推荐一款浏览器数据库的开源工具库——Dexie.js(JavaScript调用)
x 打工人ai神器