sessionStorage属性

该sessionStorage属性允许您访问当前源的会话Storage对象。sessionStorage类似于Window.localStorage; 唯一的区别是当存储在localStorage中的数据没有到期设置时，存储在sessionStorage中的数据在页面会话结束时被清除。只要浏览器处于打开状态，页面会话就会持续，并且会在页面重新加载和恢复后继续存在。在新选项卡或窗口中打开页面将导致启动新会话，这与会话cookie的工作方式不同。

需要注意的是，存储在sessionStorage或localStorage  中的数据特定于页面协议的。

sessionStorage属性语法

// Save data to sessionStorage
sessionStorage.setItem('key', 'value');

// Get saved data from sessionStorage
var data = sessionStorage.getItem('key');

// Remove saved data from sessionStorage
sessionStorage.removeItem('key');

// Remove all saved data from sessionStorage
sessionStorage.clear();

sessionStorage属性值

一个Storage对象。

sessionStorage属性示例

以下代码段访问当前域的会话Storage对象，并使用Storage.setItem()向它添加数据项：

sessionStorage.setItem('myCat', 'Tom');

以下示例自动保存文本字段的内容，如果浏览器被意外刷新，则还原文本字段内容，以便不会丢失写入内容：

// Get the text field that we're going to track
var field = document.getElementById("field");
 
// See if we have an autosave value
// (this will only happen if the page is accidentally refreshed)
if (sessionStorage.getItem("autosave")) {
  // Restore the contents of the text field
  field.value = sessionStorage.getItem("autosave");
}
 
// Listen for changes in the text field
field.addEventListener("change", function() {
  // And save the results into the session storage object
  sessionStorage.setItem("autosave", field.value);
});

规范

浏览器兼容性