JavaScript Cookie 实例

干一盆盐杨梅 2022-09-27 09:35:18  50768

分类专栏：资讯

在今天的实例中，我们将创建 cookie 来存储访问者名称。

首先，访问者访问 web 页面, 他将被要求填写自己的名字。该名字会存储在 cookie 中。

访问者下一次访问页面时，他会看到一个欢迎的消息。

在这个实例中我们会创建 3 个 JavaScript 函数:

设置 cookie 值的函数
获取 cookie 值的函数
检测 cookie 值的函数

前期准备

在我们的桌面新建一个以html为后缀的文本文档，然后点击右键，在notepad++.exe 中打开

设置 cookie 值的函数

首先，我们创建一个函数用于存储访问者的名字：

        function setCookie(cname,cvalue,exdays){
           var d = new Date();
            d.setTime(d.getTime()+(exdays*24*60*60*1000));
           var expires = "expires="+d.toGMTString();
           document.cookie = cname+"="+cvalue+"; "+expires;
        }

获取 cookie 值的函数

然后，我们创建一个函数用于返回指定 cookie 的值：

检测 cookie 值的函数

最后，我们可以创建一个检测 cookie 是否创建的函数。

如果设置了 cookie，将显示一个问候信息。

如果没有设置 cookie，将会显示一个弹窗用于询问访问者的名字，并调用 setCookie 函数将访问

者的名字存储 30 天：

完整实例

下面的红色字体是为了解决乱码问题，因为有的网页可能访问会出现乱码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>wwuw</title>
</head>
<head>
<script>
function setCookie(cname,cvalue,exdays){
   var d = new Date();
   d.setTime(d.getTime()+(exdays*24*60*60*1000));
   var expires = "expires="+d.toGMTString();
   document.cookie = cname+"="+cvalue+"; "+expires;
}
function getCookie(cname){
   var name = cname + "=";
   var ca = document.cookie.split(';');
   for(var i=0; i<ca.length; i++) {
       var c = ca[i].trim();
       if (c.indexof(name)==0) { return c.substring(name.length,c.length);}
   }
   return "";
}
function checkCookie(){
   var user=getCookie("username");
   if (user!=""){
       alert("欢迎 " + user + " 再次访问");
   }
   else {
       user = prompt("请输入你的名字:","");
       if (user!="" && user!=null){
           setCookie("username",user,30);
       }
   }
}
</script>
</head>