web存储机制localStorage和sessionStorage
生活随笔
收集整理的這篇文章主要介紹了
web存储机制localStorage和sessionStorage
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
https://www.cnblogs.com/yaoyuqian/p/7901052.html
web存儲包括兩種：sessionStorage 和 localStorage（都是限定在文檔源級別，非同源文檔間無法共享）
1.sessionStorage 數據放在服務器上（IE不支持）嚴格用于一個瀏覽器會話中存儲數據，數據在瀏覽器關閉后會立即刪除 2.localStorage 數據在客戶端（低版本IE ( IE6, IE7 ) 不支持，并且不支持查詢語言）跨會話持久化地存儲數據localStorage與sessionStorage的區別：localStorage只要在相同的協議、相同的主機名、相同的端口下，即同源就能讀取/修改到同一份localStorage數據。sessionStorage比localStorage更嚴苛一點，除了協議、主機名、端口外，還要求在同一窗口（也就是瀏覽器的標簽頁）下。用法相同：（以sessionStorage為例）1.添加：sessionStorage.setItem(key, value);//value可以任何數據類型2.獲取： sessionStorage.getItem(key); 3.刪除： sessionStorage.removeItem(key);//刪除該存儲對象中key的鍵值對 4.清除所有： sessionStorage.clear();//清除該存儲對象中所有的鍵值對 5.檢索（查）： sessionStorage.key();//檢索key[n]的值 實例： localStorage.setItem("x",1);//以"x"的名字存儲一個數值localStorage.x = 1;//直接向 Web 存儲對象添加鍵/值對localStorage.getItem("x");//獲取數值localStorage.x;//直接從 Web 存儲對象中檢索鍵/值對localStorage.removeItem("x");//刪除“x”項。//removeItem是唯一通用的能刪除單個名值對的方式。（因為IE8不支持delete操作符）localStorage.clear();//全部刪除。唯一能刪除存儲對象中所有名值對的方式//將一個數組存儲為字符串var myArray = new Array('First Name', 'Last Name', 'Email Address');localStorage.formData = JSON.stringify(myArray);//檢索數組的字符串版本并將它轉換成一個可用的 JavaScript 數組var myArray = JSON.parse(localStorage.formData); 還有一種更實用的存取方法：var obj = {
name: 'doctorhou',
describe: '高大、威猛、帥氣'
};
localStorage.setItem('test', JSON.stringify(obj));
var getObj = JSON.parse(localStorage.getItem('test'));
示例：
<body><h3>這是我的用戶名和密碼</h3><div id="username"></div><div id="password"></div><script>// 1.獲取對象var username = document.getElementById('username');var password = document.getElementById('password');// 2.將存儲的數據寫入到兩個div中username.innerHTML = localStorage.getItem('username');password.innerHTML = localStorage.getItem('password');// 3.做stroage的事件監聽window.onstorage = function(e) {// StorageEvent// console.log(e);// console.log(e.key);修改的鍵// console.log(e.oldValue);原來的值// console.log(e.newValue);新值username.innerHTML = e.newValue;}</script></body>轉載于:https://www.cnblogs.com/beimingbingpo/p/9603563.html
總結
以上是生活随笔為你收集整理的web存储机制localStorage和sessionStorage的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： j.u.c系列（08）---之并发工具类
- 下一篇： SPSS图文教程：正态转换的多种方法