1.說明
sessionStorage是HTML5新增的一個會話存儲對象,用於臨時保存同一窗口(或標簽頁)的數據,在關閉窗口或標簽頁后將會刪除這些數據。
在JavaScript語言中,可以用window.sessionStorage或sessionStorage調用此對象。
2.特點
1)同源策略限制。若想在不同頁面之間對同一個sessionStorage對象進行操作,這些頁面必須在同一個協議、同一個主機名和同一個端口下。
2)單標簽頁限制。sessionStorage操作限制在單個標簽頁中,在此標簽頁中進行同源頁面訪問都可以共享sessionStorage數據。
3)只在本地存儲。sessionStorage的數據不會跟隨HTTP請求一起發送的服務器,只會在本地生效,並在關閉標簽頁后刪除數據。(若使用Chrome恢復標簽頁的功能,
sessionStorage的數據也會恢復)
4)存儲方式。sessionStorage的存儲方式使用key、value的方式。value的值必須是字符串的形式(非字符串,也會在存儲時轉換為字符串。true值會轉換為"true")
5)存儲上限限制。不同的瀏覽器存儲上限都有不同,大部分瀏覽器會控制在5Mb以內。
3.適合場景
sessionStorage非常適合SPA(單頁面應用程序),可以方便在各業務模塊進行傳值。
4.成員
4.1屬性
readonly int sessionStorage.length():返回一個整數,表示存儲在sessionStorage對象中的數據項(鍵值對)數量。
4.2方法
String sessionStorage.key(int index):返回當前sessionStorage對象的第index序號的key名稱。若沒有返回null。
String sessionStorage.getItem(String key):返回鍵名(key)對應的值(value)。若沒有返回null。
void sessionStorage.setItem(String key,String value):該方法支持將鍵值對key-value存儲到sessionStorage中;如果鍵名存在,則更新其對應的值。
void sessionStorage.removeItem(String key):將指定的鍵名(key)從sessionStorage中移除。
void sessionStorage.clear():清楚sessionStorage對象所有的項。
5.示例
5.1)存儲數據
5.1.1)采用sessionStorage.setItem()方法存儲
sessionStorage.setItem("testKey","這是一個測試的value值");
5.1.2)通過屬性方式存儲
sessionStorage["testKey"]="這是一個測試的value值";
或 sessionStorage.testKey="這是一個測試的value值";
5.2)讀取數據
5.2.1)通過getItem()方法讀取數據
sessionStorage.getItem("testKey");
5.2.2)通過屬性方式取值
sessionStorage["testKey"];
或sessionStorage.testKey;
5.3)存儲JSON對象
sessionStorage也可存儲JSON對象:存儲時,通過JSON.stringify()將對象轉換為文本格式;讀取時,通過JSON.parse()將文本轉換回對象。
var userEntity={
name:"baobao";
age:3
};
//存儲值:將對象轉換為JSON字符串
sessionStorage.setItem("user",JSON.stringify(userEntity));
//取值時:把獲取的文本再轉換為JSON對象
var userJsonStr=sessionStorage.getItem("user");
userEntity=JSON.parse(userJsonStr);