cookie封装

虽然现在HTML5胜行,localStorage已远远的胜过cookie,但是在天朝,ie6(基本已淘汰),ie7还需要考虑的前提下,cookie还是有用武之地的。

一直都有到cookie,也有了解过cookie的原理,工作中也一直不能忽视工期,基本使用cookie就用jquery.cookie.js解决啦,今天正好有时间就封装下原生的cookie函数。

代码如下(有详细注释):

/设置cookie
    function setCookie(name,value,d){
        var dateo=new Date(),//获取当前时间对象
            day=dateo.getDate();//获取当前的日期-1值
        dateo.setDate(day+d);//修改当前值为d天后
        document.cookie=name+"="+encodeURI(value)+"; expires="+dateo.toGMTString();//设置cookie,expires为过期日期,设置的格式应该是"name=value; expires=过期日期"
    }
    
    //获取cookie
    function getCookie(name){
        var cookiestr=document.cookie,//获取cookie,格式应该为"name=value; name0=value0"
            cookiearr0=cookiestr.split("; "),//以"; "来分构字符串成数组 ["name=value","name0=value0"]
            cookiearr1=[];
        for(var i=0;i<cookiearr0.length;i++){
            cookiearr1=cookiearr0[i].split("=");//以"="分构字符串为数组,["name","value"]
            if(cookiearr1[0]==name){//如果找到相同名称的cookie,返回它的值
                return decodeURI(cookiearr1[1]);
            }
        }
        return "";//如果没有找到相同名的cookir,返回空
    }

    //删除cookie
    function removeCookie(name){
        setCookie(name,"",-1);//把过期时间设为昨天,即删除了当前cookie
    }

测试代码如下(本地用火狐,chrome本地不支持操作cookie,IE下查看不方便):

    setCookie("test","你是谁?",1);
    console.log(getCookie("test"));
    setTimeout(function(){
        removeCookie("test");
    },10000)
    setTimeout(function(){
        console.log(getCookie("test"));
    },11000)

在线测试环境

转载于:https://www.cnblogs.com/xwwin/p/4827777.html

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当涉及到读写 Cookie 时,可以使用以下方法进行封装: 1. 设置 Cookie:使用`document.cookie`属性来设置 Cookie。通过传递参数来设置 Cookie 的名称、值以及其他可选的属性(例如过期时间、路径等)。封装一个函数如下: ```javascript function setCookie(name, value, days, path) { let expires = ""; if (days) { let date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); expires = "; expires=" + date.toUTCString(); } document.cookie = name + "=" + (value || "") + expires + "; path=" + (path || "/"); } ``` 使用示例: ```javascript setCookie("username", "John Doe", 7); // 设置一个名为 "username" 的 Cookie,有效期为7天 ``` 2. 获取 Cookie:使用`document.cookie`属性来获取所有的 Cookie,然后解析出指定名称的 Cookie 值。封装一个函数如下: ```javascript function getCookie(name) { let cookieArr = document.cookie.split("; "); for (let i = 0; i < cookieArr.length; i++) { let cookiePair = cookieArr[i].split("="); if (name === cookiePair[0]) { return decodeURIComponent(cookiePair[1]); } } return null; } ``` 使用示例: ```javascript let username = getCookie("username"); // 获取名为 "username" 的 Cookie 值 ``` 3. 删除 Cookie:通过设置 Cookie 的过期时间为过去的时间来删除 Cookie封装一个函数如下: ```javascript function deleteCookie(name) { document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; } ``` 使用示例: ```javascript deleteCookie("username"); // 删除名为 "username" 的 Cookie ``` 这样,你可以封装这些函数,以便在需要的时候方便地操作 Cookie
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值