小編給大家分享一下javascript如何實(shí)現(xiàn)cookie操作，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都網(wǎng)站制作、成都網(wǎng)站建設(shè)、外貿(mào)營(yíng)銷網(wǎng)站建設(shè)的關(guān)注點(diǎn)不是能為您做些什么網(wǎng)站，而是怎么做網(wǎng)站，有沒有做好網(wǎng)站，給成都創(chuàng)新互聯(lián)公司一個(gè)展示的機(jī)會(huì)來證明自己，這并不會(huì)花費(fèi)您太多時(shí)間，或許會(huì)給您帶來新的靈感和驚喜。面向用戶友好，注重用戶體驗(yàn)，一切以用戶為中心。

方法：1、用“document.cookie="名稱=值;"”語(yǔ)句來設(shè)置cookie或者修改cookie值；2、用“document.cookie”語(yǔ)句獲取cookie值；3、通過將有效時(shí)間“expires”設(shè)置為過期值來刪除cookie。

本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

cookie 是存儲(chǔ)于訪問者的計(jì)算機(jī)中的變量，當(dāng)用戶訪問了某個(gè)網(wǎng)站時(shí)，就可以通過 cookie 向訪問者計(jì)算機(jī)上存儲(chǔ)數(shù)據(jù)。之后，當(dāng)用戶在同一臺(tái)計(jì)算機(jī)通過瀏覽器再次請(qǐng)求該頁(yè)面時(shí)，會(huì)發(fā)送這個(gè) cookie，因而可以使用 cookie 來識(shí)別用戶。

1. 設(shè)置cookie

使用 cookie 來存儲(chǔ)數(shù)據(jù)是通過設(shè)置 cookie 來實(shí)現(xiàn)的。每個(gè) cookie 都是一個(gè)名/值對(duì)，名/值對(duì)用等號(hào)連接，并將該名/值對(duì)賦值給 document.cookie 即可。一次可以將多個(gè)名/值對(duì)賦給 document.cookie，并使用分號(hào)加空格隔開每個(gè)名/值對(duì)。

設(shè)置 cookie 的基本格式如下：

document.cookie = "名稱1=值1[; 名稱2=值2; …]";

設(shè)置 cookie 的示例如下：

document.cookie = "username=abc";
document.cookie = "age=23";
document.cookie = "username=abc; age=23";

需要注意的是，在 cookie 的名稱或值中不能使用分號(hào)；和等號(hào)=等符號(hào)。如果想存入這些符號(hào)，需要使用 escape() 函數(shù)進(jìn)行編碼。例如：document.cookie="str="+escape("username=nch")，該代碼等效于：document.cookie="str=username%3Dnch"，即等號(hào)被編碼為%3D。當(dāng)使用 escape() 編碼后，在取出值以后需要使用 unescape() 進(jìn)行解碼才能得到原來的 cookie 值。

另外，使用上述格式設(shè)置的 cookie 中的值在用戶計(jì)算機(jī)中存儲(chǔ)時(shí)，是以網(wǎng)站域名形式來區(qū)分不同網(wǎng)站的數(shù)據(jù)，而且不同瀏覽器存放 cookie 的位置不一樣，因此不同瀏覽器之間存儲(chǔ)的 cookie 不可以相互訪問。另外，同一個(gè)域名下存放的 cookie 的個(gè)數(shù)是有限制的，不同的瀏覽器對(duì)存放的個(gè)數(shù)限制不一樣。而且，每個(gè) cookie 存放的內(nèi)容大小也是有限制的，不同的瀏覽器該大小限制也不一樣。

2. 修改cookie值

如果要改變一個(gè) cookie 值，只需對(duì)它重新賦值，例如：document.cookie="age=36";這樣就可以修改前面設(shè)置的 age=23 的 cookie 值。

3. 獲取cookie

通過 document.cookie 來獲取當(dāng)前網(wǎng)站下的 cookie 時(shí)，得到的是字符串形式的值，該值包含了當(dāng)前網(wǎng)站下所有的 cookie。它會(huì)把所有的 cookie 通過一個(gè)分號(hào)+空格的形式串聯(lián)起來。

要獲取不同的 cookie 值，可以將這個(gè)包含了分號(hào)及空格的字符串使用 split() 方法按分號(hào)分隔轉(zhuǎn)換為一個(gè)字符串?dāng)?shù)組，然后再對(duì)這個(gè)字符串?dāng)?shù)組進(jìn)行遍歷即可得到每個(gè)名/值對(duì)，對(duì)這個(gè)名/值對(duì)再次使用 split() 方法按等號(hào)分隔轉(zhuǎn)換為一個(gè)包含名稱和值的數(shù)組，就可以得到指定 cookie 名稱的值了。

例如要獲取 cookie 名為 age 的值的代碼如下：

document.cookie = "username=abc; age=23";
var arr1 = document.cookie.split(';');
for(var i = 0; i < arr1.length; i++){
     var arr2 = arr1[i].split('=');
     if(arr2[0] == 'age'){
         alert(arr2[1]);
     }
}

4. 設(shè)置cookie的有效時(shí)間

默認(rèn)情況下，cookie 是臨時(shí)存儲(chǔ)的，即默認(rèn)是存在內(nèi)存的，并沒有存儲(chǔ)到硬盤中，所以存儲(chǔ)的 cookie 在瀏覽器進(jìn)程關(guān)閉后會(huì)自動(dòng)銷毀。如果想把 cookie 在計(jì)算機(jī)中保存一段時(shí)間或永久保存，則需要在設(shè)置 cookie 時(shí)對(duì)其設(shè)置一個(gè)有效時(shí)間，設(shè)置格式如下：

document.cookie = "名稱=值;expires="+字符串格式的時(shí)間;

例如：

var oDate = new Date();
oDate.setDate(oDate.getDate()+10);//訪問頁(yè)面后的10天過期
//設(shè)置cookie的有效時(shí)間，時(shí)間為字符串格式
document.cookie = 'username=abc;expires='+oDate.toGMTString();

5. 刪除cookie

直接將 cookie 的有效時(shí)間設(shè)置成過去某個(gè)時(shí)間即可。例如：

var oDate = new Date();
oDate.setDate(oDate.getDate()-1);//訪問頁(yè)面的前一天
document.cookie = 'username=abc;expires='+oDate.toGMTString();

【例 1】使用 document 操作 cookie。

注：Firefox 和 IE 在本地只允許臨時(shí)操作 cookie，關(guān)閉瀏覽器后無法獲取 cookie。而 Chrome 則不允許在本地操作 cookie。將例 1 發(fā)布到 Web 服務(wù)器上后再訪問它時(shí)，這些瀏覽器都可以操作 cookie。

下圖所示是在 Chrome 瀏覽器中訪問發(fā)布到 Tomcat Web 服務(wù)器上運(yùn)行后分別為輸入用戶名后單擊登錄按鈕和刪除按鈕的結(jié)果（Tomcat 服務(wù)器在本機(jī)，因而可以使用 localhost 作為域名來訪問它）。

輸入用戶名后單擊登錄按鈕，在單擊刪除用戶名 cookie 按鈕前關(guān)掉 Chrome 瀏覽器進(jìn)程，然后再次打開 Chrome 訪問例 1，可得到圖 3 所示的結(jié)果，即用戶名會(huì)自動(dòng)顯示在文本框中。如果單擊刪除用戶名 cookie 按鈕后關(guān)掉 Chrome 瀏覽器進(jìn)程，然后再次打開 Chrome 訪問例 1，則得到圖 4 所示的結(jié)果，此時(shí)存儲(chǔ)在 cookie 中的用戶名已刪掉，因而無法顯示在文本框中。

以上是“javascript如何實(shí)現(xiàn)cookie操作”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！