HTML5 sessionStorage會話存儲


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);

   


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM