JavaScript中的Cookies:设置、获取和删除示例
什么是Cookies?
Cookie是存储在您计算机上供浏览器访问的一段数据。您可能也或多或少地享受过Cookie带来的便利。您是否曾经保存过您的Facebook密码,这样您每次登录时就不必输入它?如果是,那么您就在使用Cookies。Cookies以键/值对的形式保存。
您为什么需要Cookie?
Web浏览器和服务器之间的通信使用一种名为HTTP的无状态协议。无状态协议将每个请求视为独立的。因此,服务器在将数据发送给浏览器后不会保留数据。但在许多情况下,数据会再次需要。这时就需要Cookie了。有了Cookies,Web浏览器就不必在每次需要数据时都与服务器通信。相反,数据可以直接从计算机中获取。
JavaScript设置Cookie
您可以使用document.cookie属性像这样创建Cookie。
document.cookie = "cookiename=cookievalue"
您甚至可以为Cookie设置过期日期,以便在指定日期从计算机中删除该Cookie。过期日期应设置为UTC/GMT格式。如果您不设置过期日期,当用户关闭浏览器时,Cookie将被删除。
document.cookie = "cookiename=cookievalue; expires= Thu, 21 Aug 2014 20:00:00 UTC"
您还可以设置域名和路径,以指定Cookie属于哪个域名以及该域名下的哪些目录。默认情况下,Cookie属于设置它的页面。
document.cookie = "cookiename=cookievalue; expires= Thu, 21 Aug 2014 20:00:00 UTC; path=/ "
//为当前页面和整个域的路径创建一个Cookie。
JavaScript获取Cookie
您可以像这样访问Cookie,它将返回当前域保存的所有Cookie。
var x = document.cookie
JavaScript删除Cookie
要删除Cookie,您只需将Cookie的值设置为空,并将expires的值设置为一个过去的时间。
document.cookie = "cookiename= ; expires = Thu, 01 Jan 1970 00:00:00 GMT"
自己尝试此示例
使代码工作的特殊说明… 按两次运行按钮
<html> <head> <title>Cookie!!!</title> <script type="text/javascript"> function createCookie(cookieName,cookieValue,daysToExpire) { var date = new Date(); date.setTime(date.getTime()+(daysToExpire*24*60*60*1000)); document.cookie = cookieName + "=" + cookieValue + "; expires=" + date.toGMTString(); } function accessCookie(cookieName) { var name = cookieName + "="; var allCookieArray = document.cookie.split(';'); for(var i=0; i<allCookieArray.length; i++) { var temp = allCookieArray[i].trim(); if (temp.indexOf(name)==0) return temp.substring(name.length,temp.length); } return ""; } function checkCookie() { var user = accessCookie("testCookie"); if (user!="") alert("Welcome Back " + user + "!!!"); else { user = prompt("Please enter your name"); num = prompt("How many days you want to store your name on your computer?"); if (user!="" && user!=null) { createCookie("testCookie", user, num); } } } </script> </head> <body onload="checkCookie()"></body> </html>