cookie
- cookie是客户端的会话跟踪技术(服务端为session)
- 作用: 将数据存储在浏览器中
- 生命周期:
- 默认是一次会话(浏览器关闭)
- 如果通过expires=设置了过期时间, 并且过期时间没有过期, 那么下次打开浏览器还是存在
- 如果通过expires=设置了过期时间, 并且过期时间已经过期了,那么会立即删除保存的数据
- 注意点:
- cookie不能一次性存储多条数据,要想保存数据,必须一条一条的设置
- cookie默认不会保存任何的数据
- cookie有大小和数量的限制:
- cookie的作用范围:
- 在同一浏览器下,如果在当前浏览器中保存了数据,那么它的下一级路径下的浏览器也可以访问
- 在同一个浏览器下,如果在当前浏览器保存了数据,如果想要上级访问,需要在path属性上添加/
- 作用范围的注意点:
- 跨域的浏览器不能访问同一个cookie,需要访问则需要加一个domain的属性,值为域名
- cookie的保存格式
var date = new Date();
date.setDate(date.getDate() + 1);
document.cookie("name = xxz;path=/;domain=baidu.com;expires = "+date.toGMTString()+";",
hash
- hash也是一种储存浏览器数据的方式
- 特点: 浏览器url后面会加上#和hash保存的数据
- 存储格式: window.location.hash = 值;
H5提供的新的存储方案
- 以下新增方案都具备以下特点,可以弥补cookie和hash的不足
- 特点:
- 设置、读取方便、页面刷新不丢失数据
- 容量较大，sessionStorage约5M、localStorage约20M
- 只能存储字符串，可以将对象JSON.stringify() 编码后存储
window.sessionStorage
- 容量约为5M
- 生命周期为关闭浏览器窗口
- 在同一个窗口(页面)下数据可以共享
- 格式:
- window.sessionStorage.setItem('name', 'lnj');
- 获取用getItem,删除用removeItem,删除所有用clear
window.localStorage
- 除了特点有所不同,其余和sessionStorage完全相同
