翻譯不完整。請協助 翻譯此英文文件。
sessionStorage
這個屬性讓開發人員將資料暫存在當下頁面(頁籤)的空間Storage
物件裡。sessionStorage跟Window.localStorage
很相似,唯一不同的地方是存放在localStorage的資料會永久保存,存放在sessionStorage的資料則會在頁面(頁籤)關閉時清空。只要該頁面頁面(頁籤)沒被關閉或者有還原(restore)該頁面,資料就會保存。開啟新頁籤或視窗會產生一個新的sessionStorage,跟Session與Cookies的做法不大一樣。
另外,應該注意一下不論資料放在sessionStorage或localStorage,都是限制在該網站的規範內,其他網站無法存取。
語法
// 將資料存到sessionStorage sessionStorage.setItem('key', 'value'); // 從sessionStorage取得之前存的資料 var data = sessionStorage.getItem('key'); // 從sessionStorage移除之前存的資料 sessionStorage.removeItem('key'); // 從sessionStorage移除之前存的所有資料 sessionStorage.clear();
回傳值
一個 Storage
物件.
範例
下面簡短的程式碼提供了在該域名頁面下的session Storage
物件,並將一段文字存放到myCat裡。
sessionStorage.setItem('myCat', 'Tom');
以下提供的範例為將文字輸入元件的內容自動保存,如果瀏覽器不小心重新整理,在頁面恢復後,會自動將內容還原,不會造成尚未送出的資料被清空。
// 取得我們要保留內容的text field元件 var field = document.getElementById("field"); // 檢查是否有之前的autosave的內容 // 這段程式碼會在瀏覽器進入該頁面時被執行 if (sessionStorage.getItem("autosave")) { // 還原先前的內容到指定的text field field.value = sessionStorage.getItem("autosave"); } // 註冊事件監聽text field內容的變化 field.addEventListener("change", function() { // 並儲存變化後的內容至sessionStorage的物件裡 sessionStorage.setItem("autosave", field.value); });
備註: 完整的範例可參考這篇文章: Using the Web Storage API。
規格
Specification | Status | Comment |
---|---|---|
HTML Living Standard The definition of 'sessionStorage' in that specification. |
Living Standard |
瀏覽器相容性
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
localStorage | 4 | (Yes) | 3.5 | 8 | 10.50 | 4 |
sessionStorage | 5 | (Yes) | 2 | 8 | 10.50 | 4 |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 2.1 | (Yes) | ? | 8 | 11 | iOS 3.2 |
所有瀏覽器的localStorage跟sessionStorage的存取空間大小不一樣,這邊提供一個測試的連結detailed rundown of all the storage capacities for various browsers。
備註: 自iOS 5.1開始, 行動版的Safari瀏覽器 將localStorage與sessionStorage資料存在快取資料夾,一般情況下,會在iOS裝置可用空間不足時,不定期清除localStorage與sessionStorage。