HTML本地储存

什么是 HTML 本地存储？

通过本地存储（Local Storage），web 应用程序能够在用户浏览器中对数据进行本地的存储。

HTML 本地存储提供了两个在客户端存储数据的对象：

window.localStorage ------ 存储没有截止日期的数据（当浏览器关闭时数据不会丢失）
window.sessionStorage ------ 针对一个 session 来存储数据（当关闭浏览器标签页时数据会丢失）
注：使用本地储存前，要先检测localStorage 和 sessionStorage 的浏览器支持

web storage和cookie的区别

Web Storage的概念和cookie相似，区别是它是为了更大容量存储设计的，并且可在不影响网站性能的前提下将大量数据存储于本地。Cookie的大小是受限的。

除此之外，Web Storage拥有setItem,getItem,removeItem,clear等方法，不像cookie需要前端开发者自己封装setCookie，getCookie。

但是Cookie也是不可以或缺的：Cookie的作用是与服务器进行交互，作为HTTP规范的一部分而存在 ，而Web Storage仅仅是为了在本地“存储”数据而生。

Session Storage、Local Storage添加key-value 的方式：

（以Local Storage为例）
localStorage.setItem(key,value);
或
localStorage.key = value ;
或
localStorage[key] = value;

读取key-value 的方式：

localStorage.getItem(“key”)；
或
localStorage[“key”]；

删除指定键的数据语法：

sessionStorage.removeItem(“key”);

删除所有数据：

sessionStorage.clear();