位置: IT常识 - 正文
javascript - localStorage 本地存储（新增、删除、修改）使用教程
发布时间：2024-01-16javascript - localStorage 本地存储（新增、删除、修改）使用教程 介绍
本文链接地址:https://www.jiuchutong.com/zhishi/297898.html
转载请保留说明！
推荐整理分享javascript - localStorage 本地存储（新增、删除、修改）使用教程，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！
现在前端做数据存储，跨页面传值，localStorage是一个很好的方式，以键值对的方式存储，也方便取值赋值，下面说一说使用方法和一些常见的使用技巧。
存值共有3种方式，localStorage相当于window对象下面的一个属性，所以有[]和.调用，但也具有自身的setItem方法// 自身方法localStorage.setItem("name","bonly");// []方法localStorage["name"]="bonly";// .方法localStorage.name="bonly";取值也是如此，自身的方法是getItem// 自身方法localStorage.getItem("name");// []方法localStorage["name"];// .方法localStorage.name;改变的方式，就是相当于给对应的key重新赋值，就会把原来的值覆盖掉// 自身方法localStorage.setItem("name","TOM");// []方法localStorage["name"]="TOM";// .方法localStorage.name="TOM";移除某一个值，可以通过对象删除属性的关键字delete也可以用自身的方法removeItem// 自身方法localStorage.removeItem("name");// []方法delete localStorage["name"];// .方法delete localStorage.name获取所有的key// 通过自身的keyfor (var i=0;i<localStorage.length;i++) {console.log(localStorage.key(i));}// 通过for in 循环获取for(var key in localStorage){console.log(key);}获取所有的值localStorage.valueOf();//取出所有的值清除所有的值localStorage.clear()判断是否具有某个key，hasOwnProperty方法localStorage.hasOwnProperty("name")// 如果存在的话返回true，不存在返回false使用技巧先判断浏览器是否支持localStorage，通过if(!window.localStorage) return;单词太长，不方便书写，可以利用 var storage=window.localStorage;字符串和原始类型需要通过JSON.stringfy转字符串，通过JSON.parse转成对象通过封装方法实现来回转化注意事项localStorage特定于页面的协议，不是同一域名，不能访问。有长度限制，5M左右，不同浏览器大小会有不同。生命周期是永久的，但是数据实际是存在浏览器的文件夹下，可能卸载浏览器就会删除。浏览器可以设置是否可以访问数据，如果设置不允许会访问失败。兼容IE8以上浏览器只能存储字符串类型，需要转成字符串存储。上一篇：JavaWeb之Cookie详解(一)(java cookie)
