localstorage和sessionstorage使用記錄(推薦)
通過(guò)閱讀各路大神對(duì)web存儲(chǔ)locastorage和sessionstorage的用法解析,自己試用了一下,在此留個(gè)備忘。
在項(xiàng)目中,如果用到很多次storage,要存儲(chǔ)很多數(shù)據(jù),就要把它封裝成函數(shù)了:
(該函數(shù)系不知名大神所寫(xiě),如有侵犯原創(chuàng),請(qǐng)聯(lián)系我……)
function setStorage(key,value){
if(!window.localStorage){
alert("瀏覽器不支持localstorage");
return false;
}else{
var storage=window.localStorage;
//寫(xiě)入字段
storage.setItem(key,value);
}
}
function getStorage(key){
if(!window.localStorage){
alert("瀏覽器不支持localstorage");
}else{
var storage=window.localStorage;
var key=storage.getItem(key);
// console.log(key);
return key;
}
}
setStorage是存儲(chǔ)數(shù)據(jù)的,key是指定的數(shù)據(jù)名稱(chēng),可以隨意起,但是一定要是字符串類(lèi)型,否則瀏覽器自動(dòng)把值作為key的名字。
如圖 第一個(gè)值,就是key不是以字符串指定的,即沒(méi)有加雙引號(hào)。
value值字符串類(lèi)型的也切記加雙引號(hào)。
在瀏覽器中如何查看storage?
較新版本的chrome瀏覽器,查看位置如圖:
在項(xiàng)目中如果多次調(diào)用同樣的存儲(chǔ)數(shù)據(jù)的函數(shù),則數(shù)據(jù)會(huì)實(shí)時(shí)改變,如果需要清除所有存儲(chǔ)的數(shù)據(jù):
localstorage.clear();或者sessionStorage.clear();
項(xiàng)目中使用的原則就是,哪個(gè)數(shù)據(jù)需要存儲(chǔ),就用哪個(gè)數(shù)據(jù)調(diào)用存數(shù)數(shù)據(jù)的函數(shù)。
以上所述是小編給大家介紹的localstorage和sessionstorage使用記錄(推薦),希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
HTML5 LocalStorage 本地存儲(chǔ)詳細(xì)概括(多圖)
這篇文章主要介紹了HTML5 LocalStorage 本地存儲(chǔ),給標(biāo)簽元素添加屬性和瀏覽器兼容性都做了詳細(xì)概括,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一2017-08-18html5 localStorage本地存儲(chǔ)_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
localStorage 即本地存儲(chǔ),可用于長(zhǎng)久保存整個(gè)網(wǎng)站的數(shù)據(jù),保存的數(shù)據(jù)沒(méi)有過(guò)期時(shí)間,直到手動(dòng)去除2017-07-06詳解HTML5 LocalStorage 本地存儲(chǔ)
本篇文章主要介紹了HTML5 LocalStorage 本地存儲(chǔ) ,HTML5 storage提供了一種方式讓網(wǎng)站能夠把信息存儲(chǔ)到你本地的計(jì)算機(jī)上,并再以后需要的時(shí)候進(jìn)行獲取。有興趣的可以了解2016-12-23html5本地存儲(chǔ) localStorage操作使用詳解
這篇文章主要介紹了html5本地存儲(chǔ) localStorage操作使用詳解的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-20HTML5 本地存儲(chǔ) LocalStorage詳解
下面小編就為大家?guī)?lái)一篇HTML5 本地存儲(chǔ) LocalStorage詳解。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-24解析HTML5中的新功能本地存儲(chǔ)localStorage
這篇文章主要介紹了HTML5中的新功能本地存儲(chǔ)localStorage,介紹了localStorage的本地存儲(chǔ)位置和幾個(gè)常用方法,需要的朋友可以參考下2016-03-01- 這篇文章主要介紹了HTML5中Localstorage的使用教程,Localstorage被用于瀏覽器和系統(tǒng)交互的本地傳出,需要的朋友可以參考下2015-07-09

localStorage的過(guò)期時(shí)間設(shè)置的方法詳解
這篇文章主要介紹了localStorage的過(guò)期時(shí)間設(shè)置的方法詳解的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨2018-11-26




