首頁 > web前端 > js教程 > 主體

JavaScript取得cookie以及刪除cookie詳解

小云云
發布: 2017-12-12 14:29:24
原創
2080 人瀏覽過

Cookie,有時也用其複數形式Cookies,指某些網站為了辨別使用者身分、進行session追蹤而儲存在使用者本地端上的資料(通常經過加密)。本文我們就和大家分享JavaScript獲取cookie以及刪除cookie的知識,希望能幫助大家。

cookie存在哪?

存在document.cookie中

cookie長啥樣?

cookie是一個字串,長下面這樣:
"name=xxx; age=22;"

注意:分號後面有個空格,記住這一點,下面的程式碼需要特別注意這一點

#如果我想根據鍵名來取得cookie, 怎麼做?

<span style="font-size: 16px;">function getCookie(name) {<br>  var value = '; '+ document.cookie;<br>  var parts = value.split('; ' + name + '=');<br>  if(parts.length === 2) {<br>    return parts.pop().split(';').shift();<br>  }<br>}<br></span>
登入後複製
登入後複製

原理分析:
假設現在的document.cookie的值為:
<span style="font-size: 16px;">myName=xxx; age=22; food=apple; </span>
<span style="font-size: 16px;">var value = '; '+ document.cookie;</span>使其變為<span style="font-size: 16px;">#; myName=xxx; age=22; food=apple;</span>
#②##var parts = value.split('; ' + name + '=');<span style="font-size: 16px;"></span> 假設傳入的name<span style="font-size: 16px;"></span> age<span style="font-size: 16px;"></span>, 那麼會根據; age=<span style="font-size: 16px;"></span>分割字串,分割之後得到的陣列為:
['myName=xxx', '22; food=apple;']<span style="font-size: 16px;"></span>
#③ if(parts. length === 2)<span style="font-size: 16px;"></span>說明根據鍵名得到了對應的值,parts.pop()<span style="font-size: 16px;"></span>##傳回的是數組中的最後一項,即22; food=apple;<span style="font-size: 16px;"></span>#,然後呼叫##split(';' )<span style="font-size: 16px;">得到陣列</span>['22', 'food=apple;']##,然後呼叫<span style="font-size: 16px;"></span>shift()會傳回陣列的第一項,即22, 即可得到我們想要的值<span style="font-size: 16px;"></span>Mem:

var 值 = '; '+ document.cookie; 這句程式碼是整個方法的精髓。 <span style="font-size: 16px;"></span>如果我想根據鍵名來刪除cookie, 怎麼做?

<span style="font-size: 16px;">function deleteCookie(name) {<br>  document.cookie = name + '=;  expires=Thu, 01 Jan 1970 00:00:01 GMT;'<br>}<br></span>
登入後複製
登入後複製

原理分析:設定cookie過期時間小於目前時間,那麼就會刪除該cookie。


cookie存在哪?

存在document.cookie中

#cookie長啥樣?

cookie是一個字串,長下面這樣:"name=xxx; age=22;"


注意:分號後面有個空格,記住這一點,下面的程式碼需要特別注意這一點

#

如果我想根據鍵名來取得cookie, 怎麼做?

<span style="font-size: 16px;">function getCookie(name) {<br>  var value = '; '+ document.cookie;<br>  var parts = value.split('; ' + name + '=');<br>  if(parts.length === 2) {<br>    return parts.pop().split(';').shift();<br>  }<br>}<br></span>
登入後複製
登入後複製

原理分析:
假設現在的document.cookie的值為:
<span style="font-size: 16px;">myName=xxx; age=22; food=apple; </span>
<span style="font-size: 16px;">var value = '; '+ document.cookie;</span>使其變為<span style="font-size: 16px;">#; myName=xxx; age=22; food=apple;</span>
#②##var parts = value.split('; ' + name + '=');<span style="font-size: 16px;"></span> 假設傳入的name<span style="font-size: 16px;"></span> age<span style="font-size: 16px;"></span>, 那麼會根據; age=<span style="font-size: 16px;"></span>分割字串,分割之後得到的陣列為:
['myName=xxx', '22; food=apple;']<span style="font-size: 16px;"></span>
#③ if(parts. length === 2)<span style="font-size: 16px;"></span>說明根據鍵名得到了對應的值,parts.pop()<span style="font-size: 16px;"></span>##傳回的是數組中的最後一項,即22; food=apple;<span style="font-size: 16px;"></span>#,然後呼叫##split(';' )<span style="font-size: 16px;">得到陣列</span>['22', 'food=apple;']##,然後呼叫<span style="font-size: 16px;"></span>shift()會傳回陣列的第一項,即22, 即可得到我們想要的值<span style="font-size: 16px;"></span>Mem:

var 值 = '; '+ document.cookie; 這句程式碼是整個方法的精髓。 <span style="font-size: 16px;"></span>如果我想根據鍵名來刪除cookie, 怎麼做?

<span style="font-size: 16px;">function deleteCookie(name) {<br>  document.cookie = name + '=;  expires=Thu, 01 Jan 1970 00:00:01 GMT;'<br>}<br></span>
登入後複製
登入後複製

原理分析:設定cookie過期時間小於目前時間,那麼就會刪除該cookie。


相關推薦:

jQuery的Cookie使用方法

cookie屬性與方法解析

JavaScript中cookie的新增與刪除的基本操作

#

以上是JavaScript取得cookie以及刪除cookie詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板