localStorage、sessionStorage(h5新特性)
存储大小限制比cookie大很多,可以达到5M或更多
用法相同,引用类型的值需要用 JSON.stringify()
保存数据
sessionStorage.setItem('key', JSON.stringify());
localStorage.setItem('key', JSON.stringify());
获取数据
sessionStorage.getItem('key');
localStorage.getItem('key');
删除某个存储的数据
sessionStorage.removeItem('key');
localStorage.removeItem('key');
删除所有保存数据
sessionStorage.clear();
localStorage.clear();
localStorage、sessionStorage (区别)
localStorage:只要在相同的协议,相同的主机名,相同的端口号,就能读取/修改到同一份localstorage数据。属于永久存储,除非手动删除
sessionStorage :只要在相同的协议,相同的主机名,相同的端口号,同一窗口下,刷新页面或进入同源的另一页面数据存在,页面关闭数据自动销毁,属于临时存储。
Cookie
当浏览器从服务器上请求 web 页面时, 属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。
存储大小的限制不能超过4K
创建/修改 Cookie
document.cookie="username=John Doe"
您还可以为 cookie 添加一个过期时间(以 UTC 或 GMT 时间)。默认情况下,cookie 在浏览器关闭时删除:
document.cookie="username=John Doe; expires=Thu, 18 Dec 2043 12:00:00 GMT";
您可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下,cookie 属于当前页面。
document.cookie="username=John Doe; expires=Thu, 18 Dec 2043 12:00:00 GMT; path=/";
读取 Cookie
var x = document.cookie;
document.cookie 将以字符串的方式返回所有的 cookie,类型格式: cookie1=value; cookie2=value; cookie3=value;
删除 Cookie
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";