本文主要详细介绍了localStorage的用法，有一定的参考价值，感兴趣的朋友可以参考一下。
一、什么是localStorage？
在HTML5中，添加了一个新的localStorage特性。该特性主要用作localStorage，解决了cookie存储空间不足的问题(cookie中每个cookie的存储空间为4k)。一般localStorage中的浏览器都支持5M的大小，不同的浏览器会有所不同。
二、localStorage的优势与局限
localStorage的优势
1.localStorage扩展了cookie的4K限制。
2.localStorage可以直接在本地存储第一次请求的数据，相当于一个5M大小的数据库用于前端页面。与cookie相比，它可以节省带宽，但这仅在高版本浏览器中受支持。
localStorage的局限
1.浏览器大小不统一，只有IE8以上的IE版本支持localStorage属性。
2.目前所有浏览器都将localStorage的值类型限制为string类型，这就需要对我们常见的JSON对象类型进行一些转换。
3.在浏览器的隐私模式下，localStorage不可读
4.localStorage本质上是读取字符串。如果存储的内容太多，会消耗内存空间，导致页面换卡。
5.爬网程序无法对localStorage进行爬网。
localStorage和sessionStorage的唯一区别是，localStorage属于永久存储，sessionStorage属于当会话结束时，sessionStorage中的键值对将被清空。
三、localStorage的使用
空本地存储
localStorage.clear() //未定义
Local//storage {length: 0}存储数据。
存储数据
Local.setItem ('name '，'蔡斌')//存储一个名称和值为蔡斌的变量。
localStorage.name='蔡斌'；//相当于上面的命令
本地//存储{名称：“蔡斌”，长度：1}读取数据
读出数据
local storage . getitem(' name ')//蔡斌，读取存储在本地存储对象中的变量名name的值。
localStorage.name //'蔡斌'
LocalStorage.valueOf() //读取LocalStorage上存储的所有数据
LocalStorage.key(0) //读取第一条数据的变量名(键值)
//遍历并输出存储在localStorage中的名称和值。
for(var I=0；ilocalStorage.lengthi ){
console . log(' local storage '中存储的' I '数据的名称为：' localStorage.key(i ')，值为：' local storage . getitem(local storage . key(I))))；
}
删除变量
local storage . remove item(' name ')；//未定义
Local//storage {length: 0}可以看到之前保存的name变量已经从localStorage中删除了。
检查变量是否保存在localStorage中。
//这些数据都是经过测试的，而且是在我目前的环境下，只是演示~
local storage . hasownproperty(' name ')//true
local storage . hasownproperty(' sex ')//false
将数组转换为本地字符串
var arr=['aa '，' bb '，' cc ']；//['aa '，' bb '，' cc']
localStorage.arr=arr //['aa '，' bb '，' cc']
local storage . arr . tolocalestring()；//'aa，bb，cc '
将JSON存储在localStorage中
var学生={
肖敏：{
姓名：'小明'，
等级：1
},
teemo: {
姓名：“teemo”，
等级：3
}
}
students=JSON.stringify(学生)；//将JSON转换成字符串并存储在变量中
console.log(学生)；
localStorage.setItem('students '，学生)；//将变量保存到localStorage中
var new students=local storage . getitem(' students ')；
newStudents=JSON.parse(学生)；//转换为JSON
console.log(新学生)；//打印出原始对象
这就是本文的全部内容。希望对大家的学习有帮助，支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。