sessionStorage 是HTML5新增的一個會話存儲對象，用于臨時保存同一窗口(或標簽頁)的數據，在關閉窗口或標簽頁之后將會刪除這些數據。本篇主要介紹 sessionStorage(會話存儲)的使用方式。包括添加、修改、刪除等操作。

1. 介紹

1.1 說明

1.2 特點

1.3 瀏覽器最小版本支持

1.4 適合場景

2. 成員

2.1 屬性

2.2 方法

3. 示例

3.1 存儲數據

3.2 讀取數據

3.3 存儲Json對象

sessionStorage 是HTML5新增的一個會話存儲對象，用于臨時保存同一窗口(或標簽頁)的數據，在關閉窗口或標簽頁之后將會刪除這些數據。

在JavaScript語言中可通過 window.sessionStorage 或 sessionStorage 調用此對象。

1) 同源策略限制。若想在不同頁面之間對同一個sessionStorage進行操作，這些頁面必須在同一協議、同一主機名和同一端口下。(IE 8和9存儲數據僅基于同一主機名，忽略協議（HTTP和HTTPS）和端口號的要求)

2) 單標簽頁限制。sessionStorage操作限制在單個標簽頁中，在此標簽頁進行同源頁面訪問都可以共享sessionStorage數據。

3) 只在本地存儲。seesionStorage的數據不會跟隨HTTP請求一起發送到服務器，只會在本地生效，并在關閉標簽頁后清除數據。(若使用Chrome的恢復標簽頁功能，seesionStorage的數據也會恢復)。

4) 存儲方式。seesionStorage的存儲方式采用key、html' target='_blank'>value的方式。value的值必須為字符串類型(傳入非字符串，也會在存儲時轉換為字符串。true值會轉換為 true )。

5) 存儲上限限制：不同的瀏覽器存儲的上限也不一樣，但大多數瀏覽器把上限限制在5MB以下。

可訪問 http://dev-test.nemikor.com/web-storage/support-test/ 測試瀏覽器的存儲上限。

支持sessionStorage的瀏覽器最小版本：IE8、Chrome 5。

sessionStorage 非常適合SPA(單頁應用程序)，可以方便在各業務模塊進行傳值。

readonly int sessionStorage.length ：返回一個整數，表示存儲在 sessionStorage 對象中的數據項(鍵值對)數量。

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)作為參數，將鍵值對添加到存儲中；如果鍵名存在，則更新其對應的值。

void sessionStorage.removeItem(string key) ：將指定的鍵名(key)從 sessionStorage 對象中移除。

void sessionStorage.clear() ：清除 sessionStorage 對象所有的項。

sessionStorage.setItem( testKey , 這是一個測試的value值 // 存入一個值

sessionStorage[ testKey ] = 這是一個測試的value值 

sessionStorage.getItem( testKey // = 返回testKey對應的值

sessionStorage[ testKey // = 這是一個測試的value值

sessionStorage也可存儲Json對象：存儲時，通過JSON.stringify()將對象轉換為文本格式；讀取時，通過JSON.parse()將文本轉換回對象。

var userEntity = { name: tom , age: 22// 存儲值：將對象轉換為Json字符串sessionStorage.setItem( user , JSON.stringify(userEntity));// 取值時：把獲取到的Json字符串轉換回對象var userJsonStr = sessionStorage.getItem( user userEntity = JSON.parse(userJsonStr);console.log(userEntity.name); // = tom

相關推薦：

sessionStorage 存儲json對象

使用sessionStorage保存與獲取json對象

sessionStorage本地存儲數據實例

以上就是深入了解HTML5之sessionStorage對象的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。