var d = new Date();
d.setDate(d.getDate()+day);//设置day天后清除缓存删除设置的时间；
简单的总结了一下cookie的使用，之前总是有迷惑的地方，感觉总结之后要清晰了许多
1. cookie
定义 ： cookie是小量信息，由网络服务器发送出来以存储在网络浏览器上，从而下次这位独一无二的访客有回到该网络服务器时，可从该浏览器读回此信息。
使用原因：web程序是使用HTTP协议传输的，而HTTP协议是无状态的协议，对于事物处理没有记忆能力；缺少状态意味着如果后续处理需要前面的信息，则他必须重传，这样导致每次连接传送的数据量增加；cookie产生是为了弥补HTTP协议的不足；
终止条件：结束浏览器对话时候，即终止所有的cookie；
特点：(1)只能存储文本文件 (2)文本文件有大小限制4kb (3)数量限制50条 (4)读取有域名限制 不可跨越读取 (5)时效限制
使用时注意：
(1) document.cookie:当获取页面中的cookie值和名字符串类型；前页面存在，关闭后就没有了；document.cookie = "user = yanghuaizhi;pass = 123"
(2) 时效性：必须是日期对象；
var d = new Date();
d.setDate(d.getDate()+day);//设置day天后清除缓存删除设置的时间；
(3)cookie路径 ：但凡路径不同视为两个cookie;
(4)存储cookie
function setCookie(name,path){
document.cookie = name +"="+ value+";path="+path+";expires="+d
}
setCookie("pass","123")
(5) 移除cookie
function removeCookie(name,path){
setCookie(name,null,-1,path)
}
removeCookie("pass","/");
(6)获取getCookie
function getCookie(name){
var sCookie = document.cookie;//获取当前页面的cookie；
var aCookie = sCookie.split(";");//将获取的字符串转化为数组;[]
for(var i = 0; i < aCookie.length; i ++){//遍历数组,转化为单个数组;
var aCookieItem = aCookie[i].split("=");//将数组中的等号删除;
if(aCookieItem[0] == name){//传入的参数等于名字;
return aCookieItem[1];
}
}
return "";//如果没有获取到就返回空
}
getCookie("pass");
(10).小案例 购物车;//需要用到拼接时候获取的json
var d = new Date();
d.setDate(d.getDate() + 7);
var cookieKey = "product_" + res[i].id;
var cookieValue = "{name:'res[i].name'}";
document.cookie = cookieKey + "=" + cookieValue;
var arr = document.cookie.split(";");
for(var i = 0; i < arr.length; i ++){
var val = arr[i].split("=");//{name:'张三',price:'￥34.0',num:2};实际上有"";
if(val[0].indexOf(cookieKey) == 0){
var p = eval("("+val[1]+")");//将字符串""删去;
console.log(p.price);
}
}
2.$cookie
语法:$.cookie(名称,值,[option])
(1)读取cookie值
$.cookie(cookieName);
(2)写入设值
$.cookie(cookieName,cookieValue); $.cookie(cookieName,NULL);//销毁名为他的cookie;
(3)[option]参数说明
expires:有限日期;不设置的时候关闭浏览器的时候就消失了;
path:保存路径;默认和创建页路径一样;跨域二级域名有效要设值".xx.com"
secrue:默认为false,是否需要一个安全协议HTTP
(4)$.cookie("name",$(value).val(),{path:"/",expires:"7"});
注意点;cookie本质上是一个txt文本,只能够存入字符串,对象通常要序列化,而取得时候要反序列才得到对象;
(1)需要注意:同时存储多个数据的时候;在数组和字符串之间转换;
(2)数组=>修改数据
(3)字符串=》放进cookie之中
(4)没有cookie的情况下建立数据结构;有cookie的时候向结构中插入
(5)判断是否有cookie
if($.cookie("o") == null){
var o = {name:"zz",age :24};
var str = JSON.stringify(0);//序列化后成字符串存入cookie
$.cookie("o",str,{expires:7});
alert("为空");
}else{ //存在读出来
var str1 = $.cookie("o");
var 01 = JSON.parse(str1);//字符串反序列化对象,输出对象的姓名值;
alert(01.name);
}
(6)存储cookie中可能出现的问题
报错 : google浏览器 提示:has no method $.cookie 火狐浏览器提示:$.cookie is not a function ;可能是同一个页面两次或者多次引入jquery插件
$.cookie小案例 购物车
//需要注意:同时存储多个数据的时候;在数组和字符串之间转换;
//数组=>修改数据
//字符串=》放进cookie之中
//没有cookie的情况下建立数据结构;有cookie的时候向结构中插入;
if(!$.cookie("goods")){
//不存在
$.cookie("goods",'[{"id":'+id+',"num":1}]');
}else{
//数据结构存储
var cookie = $.cookie("goods");
var cookieArr = JSON.parse(cookie);
var same = false;//是否建立存储数据的模式
for(var i = 0; i < cookieArr.length;i ++){
if(cookieArr[i].id == id){
//数据结构中存在当前的商品
cookieArr[i].num++;
same = true;
break;
}
}
if(same == false){
var obj = {//不相等存入
id : id,
num : 1
};
cookieArr.push(obj);
}
cookie = JSON.stringify(cookieArr);//存进cookie
$.cookie("goods",cookie);
(2)获取数量
howMany(){
if($.cookie("goods")){
var acookie = JSON.parse($.cookie("goods"))
}
var res = 0;
for(var i = 0; i < acookie.length;i++){
res += acookie[i].num;
}
return res;
}