Web-网络存储（localStorage，sessionStorage）

网络存储

有两种类型的 Web 存储对象：

sessionStorage 临时存储在客户端计算机上，当用户离开您的网站时会自动抹掉。
localStorage 永久存储在客户端计算机上，以后用户再次访问您的网站时可以检索到它。

Cookie、会话存储和本地存储的客户端信息存储为键和值对。

无论服务器是否需要它们，Cookie 始终会发送到服务器。
Web 存储数据仅以编程方式发送到服务器，即当开发人员决定服务器需要它时。

设置键/值对：

使用 setItem（） 方法设置 Web 存储数据，例如，永久名称、电话号码和今天的咖啡订单：

if (typeof(Storage) !== 'undefined') {
  localStorage.setItem('name','Alice Liddell');
  localStorage.setItem('phone','0400 000 000');
  sessionStorage.setItem('coffee','Latte');
} else {
  // Sorry - you'll have to code using cookies!
}

获取键/值对：

使用 getItem（） 方法检索 Web 存储数据，例如，永久名称、电话号码和今天的咖啡订单：

var name, phone, coffee;

if (typeof(Storage) !== 'undefined') {  
name = localStorage.getItem('name');  
phone = localStorage.getItem('phone');  
coffee = sessionStorage.getItem('coffee');
} else {  
// Sorry - you'll have to code using cookies!
}

删除 Web 存储数据：

使用 removeItem（） 方法取消设置 Web 存储数据：

var name, phone, coffee;
if (typeof(Storage) !== 'undefined') {
  localStorage.removeItem('name');
}

或重置所有数据：

localStorage.clear(); // just localStorage
sessionStorage.clear(); // just sessionStorage
Storage.clear(); // both!

Cookies

Cookie 是存储在客户端计算机上的小块信息，用于存储有关用户的信息。Cookie 是一个名称 - 值对，例如：

name = "John Doe"

默认情况下，当浏览器关闭时，cookie 会被删除，但也可以为它们提供设定的到期时间（持久性 cookie）。

Javascript一直能够在客户端的机器上设置cookie来记住每个特定用户的信息，但是HTML5看到了客户端存储的大小和安全性的升级，称为Web存储，并且是存储客户端信息的更好方式。

存储数据客户端

HTTP 是一种无状态协议。这意味着一旦客户端向服务器发送了请求，并且服务器通过发送请求的信息进行了响应，连接就会终止，服务器就会忘记有关客户端/用户的所有信息。

但是，维护交互式 Web 应用程序的状态可能至关重要。查看客户端存储，即存储在Web浏览器中的内容。

在 Chrome 中，查看开发者控制台并导航到应用。

预先存储

字段可以预先填充，例如在“Remember me”类型的应用程序中的情况下：

if (localStorage.remember == 'true') {
  document.getElementById('name').value = localStorage.name;
  document.getElementById('phone').value = localStorage.phone;
}

如果未选中该复选框，则用户可以被遗忘。

if (document.getElementById('remember').checked !== true) {
  localStorage.removeItem('name');
  localStorage.removeItem('phone');
}
// or localStorage.clear(); if not storing anything else in localStorage