1.作用
保存数据
2.特点
将数据保存到本地(浏览器客户端中)
3.localStorage使用
语法:设置值
localStorage.setItem('自定义键',值)
语法:获取值
localStorage.getItem('键')
语法:删除值
1. localStorage.removeItem('键')//删除指定的数据 2. -------------------------------------------- 3. localStorage.clear() //删除本地存储中的全部数据
4.sessionStorage使用
和上面的localStorage用法一模一样
如:(就是名字换一下)
sessionStorage.setItem('自定义键',值)
5. localStorage和sessionStorage的区别
5.1 localStorage属于持久化保存(除非你删除,否则一直保存)sessionStorage是临时保存(页面刷新数据就没了)
5.2 localStorage保存的数据可以跨页面,sessionStorage不可以
5.3 localStorage保存的数据大概在20M左右,sessionStorage在4M左右
6.本地存储使用过程中的注意事项
6.1 localStorage在保存数据的时候,同一个键只能保存一条数据
6.2 如果想要将多个数据保存到同一个键,可以将多条数据保存到数组,再保存到本地
6.3 如果将多个数据保存到数组中,获取的结果是字符串
6.4 以后遇到本地存储最终的完美解决方案:
1.保存数据的时候先将数据转化为字符串:JSON.stringify(值)
2.获取通过JSON.parse()将获取的结果转化为对应的数组
结果:就是将数据从字符串转成数组,这样拿到的数据方便后续操作
7. Cookie
JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookie
还可以为 cookie 添加一个过期时间(以 UTC 或 GMT 时间)
document.cookie="username=John Doe; expires=Thu, 18 Dec 2043 12:00:00 GMT";
7.1 设置值:
document.cookie="username=John Doe";
7.2 取值:
var x = document.cookie;
7.3 删除值
非常简单,只需要设置 expires 参数为以前的时间即可,示例:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
7.4 特点
1.大小:4k左右 (对比之下,小)
2.临时保存:关闭浏览器就会消失
3.保存的数据可以跨页面
8.localStorage和sessionStorage和Cookie的区别