数据存在用户浏览器中
设置读取方便甚至刷新刷新页面不丢失数据
容量较大sessionStorage大约5M localStorage大约20M
只能存储字符串

sessionStorage 属性允许你访问一个,对应当前源的 session Storage 对象。它与 localStorage 相似,不同之处在于 localStorage 里面存储的数据没有过期时间设置,而存储在 sessionStorage 里面的数据在页面会话结束时会被清除。
语法
// 保存数据到 sessionStorage
sessionStorage.setItem('key', 'value');

// 从 sessionStorage 获取数据
let data = sessionStorage.getItem('key');

// 从 sessionStorage 删除保存的数据
sessionStorage.removeItem('key');

// 从 sessionStorage 删除所有保存的数据
sessionStorage.clear();

Window.localStorage
只读的localStorage 属性允许你访问一个Document 源(origin)的对象 Storage;存储的数据将保存在浏览器会话中。localStorage 类似 sessionStorage,但其区别在于:存储在 localStorage 的数据可以长期保留;而当页面会话结束——也就是说,当页面被关闭时,存储在 sessionStorage 的数据会被清除 。
可以多个窗口同一浏览器数据共享。

应注意,无论数据存储在 localStorage 还是 sessionStorage ,它们都特定于页面的协议。

另外,localStorage 中的键值对总是以字符串的形式存储。 (需要注意, 和js对象相比, 键值对总是以字符串的形式存储意味着数值类型会自动转化为字符串类型).

存储数据如下:
localStorage.setItem('myCat', 'Tom');

该语法用于读取 localStorage 项,如下:
let cat = localStorage.getItem('myCat');

该语法用于移除 localStorage 项,如下:
localStorage.removeItem('myCat');

该语法用于移除所有的 localStorage 项,如下:
// 移除所有
localStorage.clear();