当前位置：编程学习 > JS >>

js cookie 的使用方法记录用户浏览信息

cookie是存于用户硬盘的一个文件，这个文件通常对应于一个域名，当浏览器再次访问这个域名时，便使这个cookie可用。因此，cookie可以跨越一个域名下的多个网页，但不能跨越多个域名使用。

不同的浏览器对cookie的实现也不一样，但其性质是相同的。例如在Windows 2000以及Windows xp中，cookie文件存储于documents and settingsuserNamecookie文件夹下。通常的命名格式为：userName@domain.txt。

cookie机制将信息存储于用户硬盘，因此可以作为全局变量

代码如下

复制代码

/*
*设置与获取Cookie
*/
var Cookie = {}
//写入Cookie，key为键，value是值
//duration过期时间（天为单位，默认1天）
Cookie.write = function (key, value, duration)
{
    Cookie.remove(key);
    var d = new Date();
    if (duration <= 0)
        duration = 1;
    d.setTime(d.getTime() + 1000 * 60 * 60 * 24 * duration);
    document.cookie = key + "=" + encodeURI(value) + "; expires=" + d.toGMTString() + ";path=/";
};
//移除Cookie,key为键
Cookie.remove = function (key)
{
    var d = new Date();
    if (Cookie.read(key) != "")
    {
        d.setTime(d.getTime() - (86400 * 1000 * 1));
        document.cookie = key + "=;expires=" + d.toGMTString();
    }
};
//读取Cookie，key是键
//不存在返回空字符串""
Cookie.read = function (key)
{
    var arr = document.cookie.match(new RegExp("(^| )" + key + "=([^;]*)(;|$)"));
    if (arr != null)
        return decodeURIComponent(arr[2]);
    return "";
};

实例

要用到2个js文件，history.js，关键的聊天记录保存和读取代码。json.js，对json进行处理。

代码如下

复制代码

var addHistory=function(num,id){
    stringCookie=getCookie('history');
    var stringHistory=""!=stringCookie?stringCookie:"{history:[]}";
    var json=new JSON(stringHistory);
    var e="{num:"+num+",id:"+id+"}";
    json['history'].push(e);//添加一个新的记录
    setCookie('history',json.toString(),30);
}
//显示历史记录
var DisplayHistory=function(){
    var p_ele=document.getElementById('history');
     while (p_ele.firstChild) {
      p_ele.removeChild(p_ele.firstChild);
     }

    var historyJSON=getCookie('history');
    var json=new JSON(historyJSON);
    var displayNum=6;
    for(i=json['history'].length-1;i>0;i--){
        addLi(json['history'][i]['num'],json['history'][i]['id'],"history");
        displayNum--;
        if(displayNum==0){break;}
    }
}
//添加一个li元素
var addLi=function(num,id,pid){
    var a=document.createElement('a');
    var href='product.action?pid='+id;
    a.setAttribute('href',href);
    var t=document.createTextNode(num);
    a.appendChild(t);
    var li=document.createElement('li');
    li.appendChild(a);
    document.getElementById(pid).appendChild(li);
}
//添加cookie
var setCookie=function(c_name,value,expiredays)
{
    var exdate=new Date()
    exdate.setDate(exdate.getDate()+expiredays)
    cookieVal=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
//    alert(cookieVal);
    document.cookie=cookieVal;
}
//获取cookie
function getCookie(c_name)
{
    if (document.cookie.length>0)
      {
      c_start=document.cookie.indexOf(c_name + "=")
      if (c_start!=-1)
        {
        c_start=c_start + c_name.length+1
        c_end=document.cookie.indexOf(";",c_start)
        if (c_end==-1) c_end=document.cookie.length
//        document.write(document.cookie.substring(c_start,c_end)+"<br>");
        return unescape(document.cookie.substring(c_start,c_end))
        }
      }
    return ""
}

json数据如下

代码如下

复制代码

var JSON = function(sJSON){
    this.objType = (typeof sJSON);
    this.self = [];
    (function(s,o){for(var i in o){o.hasOwnProperty(i)&&(s[i]=o[i],s.self[i]=o[i])};})(this,(this.objType=='string')?eval('0,'+sJSON):sJSON);
}
JSON.prototype = {
    toString:function(){
        return this.getString();
    },
    valueOf:function(){
        return this.getString();
    },
    getString:function(){
        var sA = [];
        (function(o){
            var oo = null;
            sA.push('{');
            for(var i in o){
                if(o.hasOwnProperty(i) && i!='prototype'){
                    oo = o[i];
                    if(oo instanceof Array){
                        sA.push(i+':[');
                        for(var b in oo){
                            if(oo.hasOwnProperty(b) && b!='prototype'){
                                sA.push(oo[b]+',');
                                if(typeof oo[b]=='object') arguments.callee(oo[b]);
                            }
                        }
                        sA.push('],');
                        continue;
                    }else{
                        sA.push(i+':'+oo+',');
                    }
                    if(typeof oo=='object') arguments.callee(oo);
                }
            }
            sA.push('},');
        })(this.self);
        return sA.slice(0).join('').replace(/[object object],/ig,'').replace(/,}/g,'}').replace(/,]/g,']').slice(0,-1);
    },
    push:function(sName,sValue){
        this.self[sName] = sValue;
        this[sName] = sValue;
    }
}

html代码

代码如下	复制代码
<script type="text/javascript" src="../js/json.js"></script> <script type="text/javascript" src="../js/history.js"></script> <ul id="history"> </ul> <script> addHistory(15810782304,2); addHistory(64654665,2); addHistory(6843212,2); addHistory(84984432521,2); setInterval("DisplayHistory()",1000); </script>

补充：网页制作,js教程

上一个：javascript邮箱验证代码分析
下一个：javascript window.location获取url各项参数详解

更多图片编程知识:

更多JS疑问解答：: 几个验证11位手机号码格式的js代码; js如何获得FCKeditor控件的值; 用js限制投票的cookie .目前设置的为：<input type="" class="" onclick="'window.location...; JS验证，这块“牛皮”反复修改都不能实现; 在JS中使用DOM模型; 如何用JS 获取本地文件夹的文件列表; js中new 了两个Object数组。怎么样将数组内容合并，重复的内容？; 求实现自动生成图片缩略图的JS代码; JS脚本网页问题; js，代码中"object"和"Object"区别？; js+flash实现网页图片切换效果，出现边框，单击激活此控件。; JS怎样操作PHP中的参数; js 怎么在一打开页面就加载这个函数。; Date.parse()的问题(js); <script src="/{maxcms:sitepath}js/common.js"></script>是什么意思

站长资源库

如果你遇到编程学习难题：
请访问www.zzzyk.com 试试

CopyRight © 2012 站长网编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络，