Cookie 是一些數據, 存儲于你電腦上的文本文件中。
當 web 服務器向瀏覽器發送 web 頁面時,在連接關閉后,服務端不會記錄用戶的信息。
Cookie 的作用就是用于解決 "如何記錄客戶端的用戶信息":
當用戶訪問 web 頁面時,他的名字可以記錄在 cookie 中。
在用戶下一次訪問該頁面時,可以在 cookie 中讀取用戶訪問記錄。
Cookie 以名/值對形式存儲,如下所示:
username=John Doe
當瀏覽器從服務器上請求 web 頁面時, 屬于該頁面的 cookie 會被添加到該請求中。服務端通過這種方式來獲取用戶的信息
使用 JavaScript 創建Cookie
JavaScript 可以使用 document.cookie 屬性來創建 、讀取、及刪除 cookie。
JavaScript 中,創建 cookie 如下所示:
document.cookie="username=John Doe";
您還可以為 cookie 添加一個過期時間(以 UTC 或 GMT 時間)。默認情況下,cookie 在瀏覽器關閉時刪除:
document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT";
您可以使用 path 參數告訴瀏覽器 cookie 的路徑。默認情況下,cookie 屬于當前頁面。
document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
使用 JavaScript 讀取 Cookie
在 JavaScript 中, 可以使用以下代碼來讀取 cookie:
var x = document.cookie;
document.cookie 將以字符串的方式返回所有的 cookie,類型格式: cookie1=value; cookie2=value; cookie3=value;
使用 JavaScript 修改 Cookie
在 JavaScript 中,修改 cookie 類似于創建 cookie,如下所示:
document.cookie="username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
舊的 cookie 將被覆蓋
使用 JavaScript 刪除 Cookie
刪除 cookie 非常簡單。您只需要設置 expires 參數為以前的時間即可,如下所示,設置為 Thu, 01 Jan 1970 00:00:00 GMT:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
注意,當您刪除時不必指定 cookie 的值
實例
<html>
<head>
<script type="text/javascript">
function getCookie(c_name)
{
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
{
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}
function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}
function checkCookie()
{
username=getCookie('username')
if (username!=null && username!="")
{alert('Welcome again '+username+'!')}
else
{
username=prompt('Please enter your name:',"")
if (username!=null && username!="")
{
setCookie('username',username,365)
}
}
}
</script>
</head>
<body onLoad="checkCookie()">
</body>
</html>
在輸入cookie信息時不能包含空格,分號,逗號等特殊符號,而在一般情況下,cookie 信息的存儲都是采用未編碼的方式。所以,在設置 cookie 信息以前要先使用escape()函數將 cookie 值信息進行編碼,在獲取到 cookie 值得時候再使用unescape()函數把值進行轉換回來。如設置cookie時:
document.cookie = name + "="+ escape (value)
return unescape(document.cookie.substring(c_start,c_end))
這樣就不用擔心因為在cookie值中出現了特殊符號而導致 cookie 信息出錯了。