一、认识cookie
- cookie : 存储在本地的一个数据,当用户访问了某个网站(网页)的时候,我们就可以通过cookie来向访问者电脑上存储数据。
- 不同的浏览器存放的cookie位置不一样,也是不能通用的。
- cookie的存储是以域名形式进行区分的,每个域名对应一个cookie存储地址。
- cookie的数据可以设置名字的。
- 一个域名下存放的cookie的个数是有限制的,不同的浏览器存放的个数不一样。
- 每个cookie存放的内容大小也是有限制的,不同的浏览器存放大小不一样。
- 默认存储时间就是当前会话。
- cookie可以设置多个,只有同名cookie能够覆盖原来的cookie。
二、访问cookie
要在服务器环境下,通过document.cookie
来获取当前网站下的cookie的时候,得到的字符串形式的值,他包含了当前网站下所有的cookie。他会把所有的cookie通过一个分号+空格的形式串联起来。
consol.log( document.cookie );
三、存储cookie
document.cookie = '数据名=值'; //不设置时间 ,当前会话结束
四、设置cookie过期时间
- cookie默认是临时存储的,当浏览器关闭进程的时候自动销毁,如果我们想长时间存放一个cookie。需要在设置这个cookie的时候同时给他设置一个过期的时间。过期时间必须是一个日期对象转换成的字符串(时间戳.toGMTString())
document.cookie = ‘数据名=值; expires=过期时间’;
- 把时间设置为过期时间,cookie会被删除。
document.cookie = 'name=abc;expires='+date.toGMTString();//date=>new Date();时间对象
var date = new Date(new Date().getTime() + 30 * 60 * 1000);//30分钟后过期的cookie
document.cookie = 'name=abc;expires='+date.toGMTString();
五、封装cookie
var cookieArr = [
{
name : 'test1',
value : '30分钟',
time : 30
},
{
name : 'test2',
value : '50分钟',
time : 50
},
{
name : 'test3',
value : '30天',
time : 30 * 24 * 60
},
{
name : 'test4',
value : '30秒',
time : 0.5
}
];
setCookie(cookieArr);//数组的形式
setCookie({
name : 'obj',
value : 'dasjd=/\\||;',
time : 10
});//json的形式
/*
* 设置一个cookie //
* */
function setCookie(data) {
if(is_array(data)){
for(var i = 0,iL = data.length;i < iL;i++){
setCookie(data[i]);
}
}else{
var _date = new Date(new Date().getTime() + data.time * 60 * 1000).toGMTString();
document.cookie = data.name+'='+encodeURIComponent(data.value)+';expires='+_date;
}
//var _date = new Date(new Date().getTime() + data.time * 60 * 1000).toGMTString();
//document.cookie = data.name+'='+data.value+';expires='+_date;
}
/*
* 删除一个cookie
* */
function delCookie(_name) {
setCookie({
name : _name,
value : '',
time : -1//设置一个过期时间
});
}
/*
* 获取一个cookie
* */
function getCookie(_name) {
var data = document.cookie.match(new RegExp('\\b'+_name+'=([^;]+)(;|$)'));
return data ? decodeURIComponent(data[1]) : '';
}
//判断是否为一个数组
function is_array(arr) {
return arr != null && typeof arr == 'object' && typeof arr.length == 'number'
}
网友评论