JQuery和JS操作LocalStorage/SessionStorage的方法

LocalStorage

• 是對Cookie的優化
• 沒有時間限制的數據存儲
• 在隱私模式下不可讀取
• 大小限制在500萬字符左右，各個瀏覽器不一致
• 在所有同源窗口中都是共享的
• 本質是在讀寫文件，數據多的話會比較卡（firefox會一次性將數據導入內存）
• 不能被爬蟲爬取，不要用它完全取代URL傳參
• IE７及以下不支持外，其他標准瀏覽器都完全支持

SessionStorage

• 針對一個 session 的數據存儲
• 大小限制在5M左右，各個瀏覽器不一致
• 僅在當前瀏覽器窗口關閉前有效（適合會話驗證）
• 不在不同的瀏覽器窗口中共享，即使是同一個頁面

 

SessionStorage:

存儲數據：

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

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

讀取數據：

sessionStorage.getItem('testKey'); // => 返回testKey對應的值

sessionStorage['testKey']; // => 這是一個測試的value值

存儲JSON:

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

 

 

 

 

 

 

 

localhostStorage:

JS下的操作方法

• 獲取鍵值：localStorage.getItem(“key”)
• 設置鍵值：localStorage.setItem(“key”,”value”)
• 清除鍵值：localStorage.removeItem(“key”)
• 清除所有鍵值：localStorage.clear()
• 獲取鍵值2：localStorage.keyName
• 設置鍵值2：localStorage.keyName = “value”

JQ下的操作方法（JS方法前加”window.”）

• 獲取鍵值：window.localStorage.getItem(“key”)
• 設置鍵值：window.localStorage.setItem(“key”,”value”)
• 清除鍵值：window.localStorage.removeItem(“key”)
• 清除所有鍵值：window.localStorage.clear()
• 獲取鍵值2：window.localStorage.keyName
• 設置鍵值2：window.localStorage.keyName = “value”