本地存儲之sessionStorage


源碼可以到GitHub上下載!
sessionStorage:
  關閉瀏覽器再打開將不保存數據
 
  復制標簽頁會連同sessionStorage數據一同復制

  復制鏈接地址打開網頁不會復制seessionStorage內的數據
 
  清除緩存加載當前頁對頁面無影響

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

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

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

    4) 存儲方式。seesionStorage的存儲方式采用key、value的方式。value的值必須為字符串類型(傳入非字符串,也會在存儲時轉換為字符串。true值會轉換為"true")。

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

  可訪問 http://dev-test.nemikor.com/web-storage/support-test/ 測試瀏覽器的存儲上限。
 1         // sessionStorage使用示例
 2         var username = document.getElementById("username"); // 獲取input username
 3         var userpwd = document.getElementById("userpassword"); // 獲取input userpassword
 4         var remember = document.getElementById("remember"); // 獲取記住賬號密碼
 5         // 點擊復選框記住 賬號、密碼、復選框
 6         function rememberValue() {
 7             if (remember.checked == true) {
 8                 sessionStorage.setItem('user', username.value);
 9                 sessionStorage.setItem('pwd', userpwd.value);
10                 sessionStorage.setItem('remember', remember.checked);
11             } else {
12                 sessionStorage.removeItem("user");
13                 sessionStorage.removeItem("pwd");
14                 sessionStorage.removeItem("remember");
15                 // sessionStorage.clear();// 全部刪除
16             }
17         }
18         // 頁面加載完畢后從sessionStorage里讀取值並填入相應的標簽內
19         window.onload = function () {
20             username.value = sessionStorage.getItem("user");
21             userpwd.value = sessionStorage.getItem("pwd");
22             remember.checked = sessionStorage.getItem("remember");
23         }

 


免責聲明!

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



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