HTML5本地存储
本地存储是指在客户端存储数据，HTML5 为我们提供了两种 API，分别是 localStorage和sessionStorage，二者作为 HTML5 新增的特性，它们的使用方法类似，都可以用来存储客户端临时信息，并且二者存储的数据格式均为 key/value 对的数据。区别在与生命周期，localStorage 除非手动清除，否则会永久保存在客户端，而 sessionStorage 仅仅在当前网页回话下有效，在关闭页面或者浏览器就会被清除。
localStorage 对象提供的方法如下：
| 方法 | 说明 |
|---|---|
| setItem(key,value) | 保存数据到本地存储 |
| getItem(key) | 从本地存储获取数据 |
| removeItem(key) | 根据指定 key 从本地存储中移除数据 |
| clear() | 清除所有保存数据 |
sessionStorage 对象提供的方法与 localStorage 对象相同，具体如下：
| 方法 | 说明 |
|---|---|
| setItem(key,value) | 保存数据到本地存储 |
| getItem(key) | 从本地存储获取数据 |
| removeItem(key) | 根据指定 key 从本地存储中移除数据 |
| clear() | 清除所有保存数据 |
一、localStorage
localStorage 对象是 HTML 5 新增的特性，主要用于本地存储。
说到在本地存储数据，大家第一个联想到的应该是 cookie 吧。
那么，它们有什么区别呢？
localstorage 与 cookie 的区别：
localStorage解决了早期使用cookie存储遇到的存储空间不足的问题( 每条cookie的存储空间为 4k )；localStorage一般浏览器支持的是 5M 大小，具体存储大小根据浏览器的不同会有所不同。- 并且相较于
cookie而言，localStorage中的信息不会被传输到服务器。
好了，接下来让我们来看看如何使用 localStorage 吧！
localStorage 对象提供的方法如下：
| 方法 | 意义 |
|---|---|
| setItem(key,value) | 保存数据到本地存储 |
| getItem(key) | 从本地存储获取数据 |
| removeItem(key) | 根据指定 key 从本地存储中移除数据 |
| clear() | 清除所有保存数据 |
二、sessionStorage
localStorage 和 sessionStorage 对象作为 HTML5 新增的特性，都可以用来存储客户端临时信息，并且二者存储的数据格式均为 key/value 键值对数据。
sessionStorage 对象提供的方法与 localStorage 对象相同，具体如下：
| 方法 | 说明 |
|---|---|
| setItem(key,value) | 保存数据到本地存储 |
| getItem(key) | 从本地存储获取数据 |
| removeItem(key) | 根据指定 key 从本地存储中移除数据 |
| clear() | 清除所有保存数据 |
那么localStorage 和 sessionStorage 二者有什么区别呢？
他们的区别在于：
localStorage的生命周期是永久的，除非用户清除 localStorage 信息，否则这些信息将永远存在。
sessionStorage的生命周期是临时的，一旦当前窗口或标签页被关闭了，那么通过它存储的数据也就被清空了。
