存储
- cookie
- localStorage （HTML5新特性）
- sessionStorage （HTML5新特性）
cookie
- 本身用于客户端和服务端的通信，但是它有本地存储功能，于是就被借用。
- 使用 document.cookie = xxx 获取和修改
-
缺点
存储量太少
所有http请求都会携带cookie，会影响获取资源的效率
API简单，需要封装才能用document.cookie=xxx
localStorage 和 sessionStorage
- HTML5专门为存储而设计，最大容量5M，不用在请求中携带
- API简洁易用
localStorage.setItem(key,value);
localStorage.getItem(key);
sessionStorage.setItem(key,value);
sessionStorage.setItem(key,); -
区别
sessionStorage在浏览器关闭后就会自动清理掉
localStorage会一直存在本地，大部分情况下用localStorage -
注意
在iOS Safari隐藏模式下，localStorage.getItem会报错
建议统一使用try-catch进行封装
练习题
- 练习题1、cookie, localStorage与sessionStorage的区别
1，容量（cookie最大4Kb，localStorage与sessionStorage最大5Mb）
2，是否会携带到Ajax中（cookie会，localStorage与sessionStorage不会）
3，API易用性（cookie需要自己封装，localStorage与sessionStorage不用）
