【我的前端自学之路】【HTML5】web 存储

以下为自学笔记内容，仅供参考。

转发请保留原文链接：https://www.cnblogs.com/it-dennis/p/10503539.html

什么是Web存储

cookie最大的缺陷是在每一次HTTP请求中都会携带所有符合规则的cookie数据.这会增加请求响应时间,特别是XHR请求. 在HTML5中使用sessionStorage和localStorage代替cookie是更好的做法.这两种都属于web storage，相较于cookie更加安全和快速。数据不会保存在服务器上，可以存储大量的数据而不影响服务器的性能。

Web存储的两种方式

local storage

localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后，数据依然可用。

session storage

针对一个 session 的数据存储。当用户关闭浏览器窗口后，数据会被删除。

API

不管是 localStorage，还是 sessionStorage，可使用的API都相同，常用的有如下几个（以localStorage为例）：

保存数据：localStorage.setItem(key,value);
读取数据：localStorage.getItem(key);
删除单个数据：localStorage.removeItem(key);
删除所有数据：localStorage.clear();
得到某个索引的key：localStorage.key(index);

参考资料

https://www.w3cschool.cn/html5/html5-webstorage.html

https://www.w3cschool.cn/tanzt0/af72kozt.html

希望可以帮助到你，如有问题可以留言或者点击下方图片联系我！