Shulou(Shulou.com)06/03 Report--

本篇内容介绍了"JavaScript创建、更改和删除Cookie的方法"的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读，能够学有所成!

JavaScript Cookie

Cookie是计算机上存储在小文本文件中的数据。当Web服务器将网页发送到浏览器时，连接将关闭，服务器将忘记用户的所有内容。发明Cookie是为了解决"如何记住用户信息"的问题：

当用户访问网页时，他/她的名字可以存储在cookie中。

下次用户访问该页面时，cookie会"记住"他/她的名字。

Cookie以键值对形式保存，如：

username = John Doe

当浏览器从服务器请求网页时，属于该页面的cookie将添加到请求中。这样，服务器获取必要的数据以"记住"有关用户的信息。

如果您的浏览器已关闭本地Cookie支持，则以下示例均无效。

使用JavaScript创建Cookie

JavaScript可以使用[xss_clean]属性创建，读取和删除cookie。使用JavaScript，可以像这样创建一个cookie：

[xss_clean] = "username=John Doe";

您还可以添加到期日期（以UTC时间为单位）。默认情况下，在浏览器关闭时删除cookie：

[xss_clean] = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";

使用path参数，您可以告诉浏览器cookie属于哪个路径。默认情况下，cookie属于当前页面。

[xss_clean] = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";使用JavaScript阅读Cookie

使用JavaScript，cookie可以像这样读取：

var x = [xss_clean];

[xss_clean]将返回一个字符串中的所有cookie，如：cookie1 = value; cookie2 =值; cookie3 =值;

使用JavaScript更改Cookie

使用JavaScript，您可以像创建cookie一样更改cookie：

[xss_clean] = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";

旧cookie被覆盖。

使用JavaScript删除Cookie

删除cookie非常简单。删除cookie时，不必指定cookie值。只需将expires参数设置为传递日期：

[xss_clean] = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

您应该定义cookie路径以确保删除正确的cookie。如果您未指定路径，某些浏览器将不允许您删除cookie。

Cookie字符串

[xss_clean]属性看起来像普通的文本字符串。但事实并非如此。即使你将一个完整的cookie字符串写入[xss_clean]，当你再次读出它时，你只能看到它的名称 - 值对。如果您设置了新cookie，则不会覆盖较旧的cookie。新的cookie被添加到[xss_clean]，所以如果你再次阅读[xss_clean]，你会得到类似的东西：cookie1 = value; cookie2 = value;

如果要查找一个指定cookie的值，则必须编写一个JavaScript函数来搜索cookie字符串中的cookie值。

JavaScript Cookie示例

在下面的示例中，我们将创建一个存储访客姓名的cookie。访问者第一次到达网页时，将要求他/她填写他/她的姓名。然后将名称存储在cookie中。下次访问者到达同一页面时，他/她将收到欢迎信息。在这个例子中，我们将创建3个JavaScript函数：

用于设置cookie值的函数

获取cookie值的函数

用于检查cookie值的函数

设置Cookie的功能

首先，我们创建一个函数将访问者的名称存储在cookie变量中：

function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays*24*60*60*1000)); var expires = "expires="+ d.toUTCString(); [xss_clean] = cname + "=" + cvalue + ";" + expires + ";path=/";}

示例说明：

上述函数的参数是cookie的名称（cname），cookie的值（cvalue）以及cookie到期之前的天数（exdays）。该函数通过将cookiename，cookie值和expires字符串相加来设置cookie。

获取Cookie的功能

然后，我们创建一个function返回指定cookie的值：

function getCookie(cname) { var name = cname + "="; var decodedCookie = decodeURIComponent([xss_clean]); var ca = decodedCookie.split(';'); for(var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return "";}

功能说明：

将cookiename作为参数（cname）。使用要搜索的文本（cname +"="）创建变量（名称）。解码cookie字符串，处理带有特殊字符的cookie，例如'$'将分号上的[xss_clean]拆分为名为ca的数组（ca = decodingCookie.split（';'））。循环通过ca数组（i = 0; i < ca.length; i ++），并读出每个值c = ca [i]）。如果找到cookie（c.indexOf（name）== 0），则返回cookie的值（c.substring（name.length，c.length））。如果找不到cookie，则返回""。

检查Cookie的功能

最后，我们创建一个函数来检查是否设置了cookie。如果设置了cookie，它将显示问候语。如果未设置cookie，它将显示一个提示框，询问用户的名称，并通过调用setCookie函数将用户名cookie存储365天：

function checkCookie() { var username = getCookie("username"); if (username != "") { alert("Welcome again " + username); } else { username = prompt("Please enter your name:", ""); if (username != "" && username != null) { setCookie("username", username, 365); } }}

所有代码都在一起实现

function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); var expires = "expires="+d.toUTCString(); [xss_clean] = cname + "=" + cvalue + ";" + expires + ";path=/";}function getCookie(cname) { var name = cname + "="; var ca = [xss_clean].split(';'); for(var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return "";}function checkCookie() { var user = getCookie("username"); if (user != "") { alert("Welcome again " + user); } else { user = prompt("Please enter your name:", ""); if (user != "" && user != null) { setCookie("username", user, 365); } }}

上面的示例checkCookie()在页面加载时运行该函数。

"JavaScript创建、更改和删除Cookie的方法"的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注网站，小编将为大家输出更多高质量的实用文章!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.