h5本地存儲storage


storage本地存儲,似乎有點想起cookie,的確用法也類似於cookie。但是storage較cookie有不少好處:

存儲量大;在客戶端完成,不會請求客戶端;

storage分為sessionStorage和localStorage。

1.sessionStorage  臨時存儲,當頁面關閉的時候,本地存儲也就消失。並且sessionStorage的數據是不會共享的。

2.localStorage 永久刪除,可以手動刪除數據,數據是共享的。

storage下有以下api:

window.sessionStorage和window.localStorage有以下4個方法:

setItem(): 設置數據,key\value類型,類型都是字符串 可以用獲取屬性的形式操作

getItem(): 獲取數據,通過key來獲取到相應的value removeItem():

刪除數據,通過key來刪除相應的value

clear(): 刪除全部存儲的值。用法如下:

window.localStorage.getItem('name')

存儲事件:

當數據有修改或刪除的情況下,就會觸發storage事件。不過,在對數據進行改變的窗口對象上是不會觸發的,也就是說有兩個及兩個以上的窗口,當有數據改變的時候,除了自己本窗口意外的其他窗口對象都會觸發storage事件。

該事件的event對象下有以下屬性:

Key : 修改或刪除的key值,如果調用clear(),key為null

newValue : 新設置的值,如果調用removeStorage(),key為null

oldValue : 調用改變前的value值

storageArea : 當前的storage對象

url : 觸發該腳本變化的文檔的url

如下:

window.addEventListener('storage',function(ev){  //當前頁面的事件不會觸
        
        console.log( ev.key );
        console.log( ev.newValue );
        console.log( ev.oldValue );
        console.log( ev.storageArea );
        console.log( ev.url );
        
    },false);

 


免責聲明!

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



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