這篇文章主要介紹jQuery訪問瀏覽器本地存儲(chǔ)cookie、localStorage和sessionStorage怎么用，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都網(wǎng)站設(shè)計(jì)、網(wǎng)站制作、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的海拉爾網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

一、cookie

定義：

存儲(chǔ)在本地，容量最大4k，在同源的http請(qǐng)求時(shí)攜帶傳遞，損耗帶寬；

可設(shè)置訪問路徑，只有此路徑及此路徑的子路徑才能訪問此cookie，存在有效的時(shí)間。

注意點(diǎn)：

cookie的訪問需要服務(wù)器環(huán)境，直接在本地文件訪問無效；

cookie的訪問和設(shè)置需要導(dǎo)入jquery.cookie.js文件；

瀏覽器對(duì)每一個(gè)訪問的地址下可添加的cookie是有限制的；同時(shí)每個(gè)瀏覽器可添加的cookie個(gè)數(shù)也存在限制。

作用：

儲(chǔ)存用戶的痕跡信息，如用戶名，ID號(hào)，密碼等，是服務(wù)器腳本發(fā)送給瀏覽器的加密數(shù)據(jù)，便于下次訪問時(shí)用戶可以直接登錄等；

運(yùn)用代碼

//訪問cookie，mycolor代表鍵
var $cook = $.cookie("mycolor");
//設(shè)置cookie
$.cookie("mycolor", "red"});
$.cookie("mycolor", "red", { expires: 7, path: '/' });//增加了有效時(shí)間和訪問路徑
//刪除cookie,傳遞null值
$.cookie("mycolor", null});

說明：

'mycolor'參數(shù)相當(dāng)于cookie存儲(chǔ)數(shù)據(jù)的鍵，即數(shù)據(jù)的名字，通過名字訪問；

cookie的設(shè)置有三個(gè)參數(shù)，第一為設(shè)置數(shù)據(jù)的鍵，第二個(gè)為設(shè)置數(shù)據(jù)的值，expires表示有效時(shí)間，單位為天，path為訪問路徑，"/"表示當(dāng)前文件路徑，在網(wǎng)站中表示根目錄。

注意：如果不設(shè)置路徑，默認(rèn)情況下只有設(shè)置cookie的網(wǎng)頁才可以訪問此cookie；如果想網(wǎng)站的網(wǎng)頁可以共享cookie，將路徑設(shè)為根目錄。

注意：cookie就相當(dāng)于一個(gè)能存儲(chǔ)數(shù)據(jù)的微型本地?cái)?shù)據(jù)庫，"mycolor"相當(dāng)于每條數(shù)據(jù)的key。

二、localStorage

定義：一個(gè)本地的小型數(shù)據(jù)文件

存儲(chǔ)在本地，容量為5M或者更大，不會(huì)在請(qǐng)求時(shí)候攜帶傳遞；

數(shù)據(jù)在所有同源窗口中共享，一直有效，除非人為刪除，可作為長期數(shù)據(jù)。

注意點(diǎn)：

localStorage數(shù)據(jù)不需要依賴服務(wù)器環(huán)境訪問，可以直接在本地文件訪問；

不需要額外的文件支持。

同源窗口指的是同一個(gè)域名下或者是index.html所在的文件夾下的文件路徑。

代碼運(yùn)用

//設(shè)置：
localStorage.setItem("mycolor", "456");
localStorage.mycolor= '456';
//獲?。?
var $color = localStorage.getItem("mycolor");
var $color = localStorage.mycolor
var $color = localStorage.key(0);//獲取第一個(gè)鍵，按角標(biāo)獲取
var $color = localStorage.key("");//獲取最后一個(gè)鍵
var $length = localStorage.length;//獲取數(shù)據(jù)的長度
//刪除
localStorage.removeItem("mycolor");
//清空
localStorage.clear();//將所有保存的數(shù)據(jù)刪除

說明：

設(shè)置數(shù)據(jù)格式類似鍵值對(duì)，"mycolor"代表key,"456"代表值。

數(shù)據(jù)是有排序的，后加入的角標(biāo)靠前，最后加入的角標(biāo)為0.

注意：localStorage相當(dāng)于將數(shù)據(jù)保存在磁盤，是永久的，但是其針對(duì)的是固定的域名下的文件，打開其他的域名下的網(wǎng)頁，localStorage不會(huì)顯示。

三、sessionStorage

定義：一個(gè)本地的小型數(shù)據(jù)庫

存儲(chǔ)在本地，容量為5M或者更大;

不會(huì)在請(qǐng)求時(shí)候攜帶傳遞，在同源的當(dāng)前窗口關(guān)閉前有效。

注意點(diǎn)：

sessionStorage同樣不需要再服務(wù)器的環(huán)境下運(yùn)行；

不需要額外的文件支持；

sessionStorage數(shù)據(jù)設(shè)置后即使頁面進(jìn)行重載也不會(huì)清除；但當(dāng)該窗口關(guān)閉后，里面的數(shù)據(jù)就會(huì)清除，再打開沒有數(shù)據(jù)。相當(dāng)于將數(shù)據(jù)保存在內(nèi)存中。

代碼運(yùn)用

//設(shè)置：
sessionStorage.setItem("mycolor", "456");
sessionStorage.mycolor= '456';
//獲?。?
var $color = sessionStorage.getItem("mycolor");
var $color = sessionStorage.mycolor
var $color = sessionStorage.key(0);//獲取第一個(gè)鍵，按角標(biāo)獲取
var $color = sessionStorage.key("");//獲取最后一個(gè)鍵
var $length = sessionStorage.length;//獲取數(shù)據(jù)的長度
//刪除
sessionStorage.removeItem("mycolor");
//清空
sessionStorage.clear();//將所有保存的數(shù)據(jù)刪除

說明：

sessionStorage的使用方法和localStorage一樣。

數(shù)據(jù)是有排序的，后加入的角標(biāo)靠前，最后加入的角標(biāo)為0.

以上是“jQuery訪問瀏覽器本地存儲(chǔ)cookie、localStorage和sessionStorage怎么用”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享文章：jQuery訪問瀏覽器本地存儲(chǔ)cookie、localStorage和sessionStorage怎么用
轉(zhuǎn)載注明：http://jinyejixie.com/article22/ggihcc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、自適應(yīng)網(wǎng)站、云服務(wù)器、網(wǎng)站導(dǎo)航、網(wǎng)站建設(shè)、小程序開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)