JS 中LocalStorage和SessionStorage的使用

更新時(shí)間：2017年08月17日 09:00:40 作者：Joseph_Bee

最近因?yàn)轫?xiàng)目上需要使用到客戶端存儲(chǔ),所以稍微研究了一下,以下說(shuō)說(shuō)自己的理解和使用經(jīng)驗(yàn)，特此分享到腳本之家平臺(tái)，感興趣的朋友參考下吧

最近因?yàn)轫?xiàng)目上需要使用到客戶端存儲(chǔ),所以稍微研究了一下,以下說(shuō)說(shuō)自己的理解和使用經(jīng)驗(yàn)

1.調(diào)用方法相同

各自都包含以下幾種操作:

//根據(jù)key獲取對(duì)應(yīng)的值;
window.sessionStorage.getItem(key);
window.localStorage.getItem(key);
//新增key-value,若key已存在,則更新value;
window.sessionStorage.setItem(key,value);
window.localStorage.setItem(key,value);
//根據(jù)key移除對(duì)應(yīng)的值
window.sessionStorage.removeItem(key);
window.localStorage.removeItem(key);
//移除全部key-value
window.sessionStorage.clear();
window.localStorage.clear();
//根據(jù)索引獲取對(duì)應(yīng)key
window.sessionStorage.key(index);
window.localStorage.key(index);

2.生命周期不同

sessionStorage是人如其名,只針對(duì)當(dāng)前session(會(huì)話)有效,關(guān)閉標(biāo)簽頁(yè)即失效;

localStorage則不然,即使關(guān)閉了標(biāo)簽頁(yè)甚至瀏覽器,依然存在,下次打開頁(yè)面時(shí),依然可以直接使用,

　　但是要注意,清除瀏覽器緩存時(shí),localStorage的內(nèi)容也會(huì)清理掉;

3.數(shù)據(jù)共享

sessionStorage由于上述特性,也就不能夠在不同頁(yè)面之間進(jìn)行數(shù)據(jù)共享,同一域名也是不可以的;

localStorage則能夠?qū)崿F(xiàn)該需求,但是僅限于同一域名下;

總結(jié)

以上所述是小編給大家介紹的JS 中LocalStorage和SessionStorage的使用，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

原生JavaScript實(shí)現(xiàn)換膚
這篇文章主要為大家詳細(xì)介紹了原生JavaScript實(shí)現(xiàn)換膚，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-02-02
layer彈出層倒計(jì)時(shí)關(guān)閉的實(shí)現(xiàn)方法
今天小編就為大家分享一篇layer彈出層倒計(jì)時(shí)關(guān)閉的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09
JS函數(shù)arguments數(shù)組獲得實(shí)際傳參數(shù)個(gè)數(shù)的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇JS函數(shù)arguments數(shù)組獲得實(shí)際傳參數(shù)個(gè)數(shù)的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-05-05
全面了解構(gòu)造函數(shù)繼承關(guān)鍵apply call
下面小編就為大家?guī)?lái)一篇全面了解構(gòu)造函數(shù)繼承關(guān)鍵apply call。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
js實(shí)現(xiàn)右鍵自定義菜單
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)右鍵菜單功能,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-12-12
js實(shí)用技巧之去除數(shù)組或者對(duì)象里重復(fù)選項(xiàng)
這篇文章主要給大家介紹了關(guān)于js實(shí)用技巧之去除數(shù)組或者對(duì)象里重復(fù)選項(xiàng)的相關(guān)資料,JavaScript數(shù)組有很多內(nèi)置方法,可以操作和處理數(shù)據(jù),文中通過(guò)代碼示例介紹的非常詳細(xì),需要的朋友可以參考下
2023-08-08
Javascript實(shí)現(xiàn)漢字和拼音互轉(zhuǎn)的終極方案
網(wǎng)上關(guān)于JS實(shí)現(xiàn)漢字和拼音互轉(zhuǎn)的文章很多，但是比較雜亂，有的不支持多音字、不支持聲調(diào)或者字典文件太大，無(wú)法根據(jù)實(shí)際需要滿足需求。這篇文章給大家修正整理網(wǎng)上的幾種常見(jiàn)方法，文章結(jié)尾還附簡(jiǎn)單的JS拼音輸入法，本文對(duì)大家具有一定的參考借鑒價(jià)值，下面一起看看吧。
2016-10-10
前端下載文件時(shí)如何后端返回的文件流一些常見(jiàn)方法
這篇文章主要介紹了前端下載文件時(shí)如何后端返回的文件流一些常見(jiàn)方法,包括使用Blob和URL.createObjectURL創(chuàng)建下載鏈接,以及處理帶有Content-Disposition的下載,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下
2025-04-04
javascript在事件監(jiān)聽(tīng)方面的兼容性小結(jié)
javascript 在事件監(jiān)聽(tīng)方面的兼容性總結(jié)，注意是由于多個(gè)瀏覽器的不一致，導(dǎo)致大家在js書寫時(shí)需要考慮多個(gè)瀏覽器的兼容性。
2010-04-04
小程序?qū)崿F(xiàn)計(jì)算器功能
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)計(jì)算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-07-07