新西兰服务器

JavaScript中怎么创建cookie来存储访问者的名称


JavaScript中怎么创建cookie来存储访问者的名称

发布时间:2022-03-15 18:12:45 来源:高防服务器网 阅读:57 作者:iii 栏目:web开发

今天小编给大家分享一下JavaScript中怎么创建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();

    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";

例子解释:

上面这个函数的的参数是:cookie 的名字(cname),cookie 的值(cvalue),以及知道 cookie 过期的天数(exdays)。

通过把 cookie 名称、cookie 值和过期字符串相加,该函数就设置了 cookie。

获取 cookie 的函数

然后,我们创建一个函数返回指定 cookie 的值:

实例

function getCookie(cname) {

    var name = cname + "=";

    var decodedCookie = decodeURIComponent(document.cookie);

    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 "";

函数解释:

把 cookie 作为参数(cname)。

创建变量(name)与要搜索的文本(CNAME”=”)。

解码 cookie 字符串,处理带有特殊字符的 cookie,例如 “$”。

用分号把 document.cookie 拆分到名为 ca(decodedCookie.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,会显示一个提示框,询问用户的名字,并存储用户名 cookie 365 天,通过调用 setCookie 函数:

实例

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();

    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";

}

function getCookie(cname) {

    var name = cname + "=";

    var ca = document.cookie.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来存储访问者的名称”这篇文章的所有内容,感谢各位的阅读!相信大家阅读完这篇文章都有很大的收获,小编每天都会为大家更新不同的知识,如果还想学习更多的知识,请关注高防服务器网行业资讯频道。

[微信提示:高防服务器能助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。

[图文来源于网络,不代表本站立场,如有侵权,请联系高防服务器网删除]
[