Web API ——Storage

Storage

Storage接口的方法包括：
Storage.getItem(), Storage.setItem(), Storage.removeItem(), Storage.clear()

sessionStorage

与localStorage不同之处在于 localStorage 里面存储的数据没有过期时间设置，而存储在 sessionStorage 里面的数据在页面会话结束时会被清除。

• 页面会话在浏览器打开期间一直保持，并且重新加载或恢复页面仍会保持原来的页面会话。
• **在新标签或窗口打开一个页面时会复制顶级浏览会话的上下文作为新会话的上下文，**这点和 session cookies 的运行方式不同。
• 打开多个相同的URL的Tabs页面，会创建各自的sessionStorage。
• 关闭对应浏览器窗口（Window）/ tab，会清除对应的sessionStorage。

存储在sessionStorage或localStorage中的数据特定于页面的协议。也就
是说http😕/example.com 与 https😕/example.com的sessionStorage相互隔离。

可使用Storage接口中的方法来进行操作，

// 保存数据到 sessionStorage
sessionStorage.setItem('key', 'value');

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

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

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

由于存储在Storage中的是字符串，因此可以使用JSON.stringify()来将JavaScript对象或值转化为JSON字符串；在取值的时候，使用JSON.parse()来解析JSON字符串，转为Javascript对象或值。
​

localStorage

无论数据存储在 localStorage 还是 sessionStorage ，它们都特定于页面的协议。
键值对以字符串的形式存储。
用法同sessionStorage