html5新增了本地储存web Storage API,相较于cookies被限制在4KB,web Storage 有了更大的容量5MB。
web Storage 分为两种:
1、sessionStorage 临时保存,浏览器关闭即删除;
2、localStorage 永久保存,除非手动删除或者清空磁盘。
他们都有四个函数,分别是setItem、getItem、removeItem和clear。localStorage和sessionStorage 的语法都相同,这里只演示localStorage
localStorage.setItem(键名,键值) //存储数据信息到本地
localStorage.getItem(键名) //读取本地存储的信息
localStorage.removeItem(键名) //删除本地存储的信息
localStorage.clear() //清空所以存储的信息
//这四个函数的用法示例:
localStorage.setItem(键名,键值)
localStorage.getItem(键名)
localStorage.removeItem(键名)
localStorage.clear()
语法记这么简单,接下来看看实例操作。
demo
sessionStorage
localStorage
当我们关闭浏览器重新打开
我们会发现session已经被清除,而localStorage还存在。
我们现在在success.html下获取
success.html下获取
获得结果
提交JSON对象格式
结果
发现并不是我们想要的形式,原来他们的储存形式都是以字符串的格式。
那么我们先转化为字符串。
转化为字符串
储存结果
解析
结果
语法都一样。自行测试吧。