HTML5的缓存

 1.cookies,sessionStorage,localStorage 的区别

共同点：都是保存在浏览器端，并且同源的

区别：

cookie与loclaStorage的区别:

cookie支持数据小且不能跨域访问，需要自己封装函数，localStorage可以本地持久化保存并且不需要自己封装get，set函数

sessionStorage和localStorage的区别：

• localStorage 适用于长期存储数据，浏览器关闭后数据不丢失
• sessionStorage 存储的数据在浏览器关闭后自动删除

cookie 与 sessionStorage 和 localStorage：

• cookie 数据始终在同源的 http 请求中携带（即使不需要），即 cookie 在浏览器和服务器间来回传递。
• 而 sessionStorage 和 localStorage 不会自动把数据发给服务器，仅在本地保存。
• cookie 数据还有路径（path）的概念，可以限制 cookie 只属于某个路径下。

2.localStorage和sessionStorage的使用

都具有相同的方法

// 1、保存数据到本地
// 第一个参数是保存的变量名，第二个是赋给变量的值
localStorage.setItem('Author', 'local');
 
// 2、从本地存储获取数据
localStorage.getItem('Author');
 
// 3、从本地存储删除某个已保存的数据
localStorage.removeItem('Author');
 
// 4、清除所有保存的数据
localStorage.clear();

// 1、保存数据到本地
// 第一个参数是保存的变量名，第二个是赋给变量的值
sessionStorage.setItem('Author', 'session');
 
// 2、从本地存储获取数据
sessionStorage.getItem('Author');
 
// 3、从本地存储删除某个已保存的数据
sessionStorage.removeItem('Author');
 
// 4、清除所有保存的数据
sessionStorage.clear();