Window: sessionStorage 屬性
只讀的 sessionStorage 屬性會訪問當前 源 的會話 Storage 物件。sessionStorage 與 localStorage 類似；不同之處在於，localStorage 僅按源進行分割槽，而 sessionStorage 則按源和瀏覽器選項卡（頂級瀏覽上下文）進行分割槽。sessionStorage 中的資料僅在頁面會話期間保留。
- 每當在瀏覽器中的特定選項卡中載入文件時，就會建立一個唯一的頁面會話並分配給該特定選項卡。該頁面會話只能在該特定選項卡中訪問。主文件和所有嵌入的 瀏覽上下文（iframe）會按其源進行分組，並且每個源都可以訪問其自己的獨立儲存區域。
- 如果頁面有
opener，sessionStorage最初是開啟它的sessionStorage物件的副本。但是，它們仍然是獨立的，一個的更改不會影響另一個。要防止sessionStorage被複制，請使用可移除opener的技術之一（請參閱Window.opener）。 - 頁面會話在選項卡或瀏覽器開啟期間持續存在，並且在頁面重新載入和恢復時會得到保留。
- 在新選項卡或視窗中開啟頁面會建立一個新的會話，其值與頂級瀏覽上下文的值相同，這與會話 cookie 的工作方式不同。
- 關閉選項卡/視窗將結束會話並清除
sessionStorage中的資料。
值
一個 Storage 物件，可用於訪問當前源的會話儲存空間。
異常
SecurityError-
在以下情況之一中丟擲
- 源不是 有效的 scheme/host/port 組合。例如，如果源使用
file:或data:scheme，則可能發生這種情況。 - 請求違反了策略決定。例如，使用者已將瀏覽器配置為阻止頁面持久化資料。
請注意，如果使用者阻止 cookie，瀏覽器可能會將其解釋為阻止頁面持久化資料的指令。
- 源不是 有效的 scheme/host/port 組合。例如，如果源使用
示例
基本用法
js
// Save data to sessionStorage
sessionStorage.setItem("key", "value");
// Get saved data from sessionStorage
let data = sessionStorage.getItem("key");
// Remove saved data from sessionStorage
sessionStorage.removeItem("key");
// Remove all saved data from sessionStorage
sessionStorage.clear();
重新整理之間儲存文字
以下示例會自動儲存文字欄位的內容，並在瀏覽器重新整理時恢復文字欄位內容，以免丟失任何輸入。
js
// Get the text field that we're going to track
let 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", () => {
// And save the results into the session storage object
sessionStorage.setItem("autosave", field.value);
});
注意： 有關完整示例，請參閱 使用 Web Storage API 文章。
規範
| 規範 |
|---|
| HTML # dom-sessionstorage-dev |
瀏覽器相容性
載入中…