js cookie

<input type="text" name="txt" id="txt" value="" />
<input type="button" name="login" id="login" value="登录" />
<input type="button" name="del" id="del" value="删除" />

JS

/*
 cookie:存储数据,当用户访问了某个网站(网页)的时候,我们就可以通过cookie来向访问者的电脑上存储数据
 1.不同的浏览器存放的cookie位置不一样,也是不能通用的
 2.cookie的存储是以域名形式进行区分
 3.cookie的数据可以设置名字的 j.name=leo
 4.一个域名下存放的cookie的个数是有限制的,不同的浏览器存放的个数不一样
 5.每个cookie存放的内容大小也是有限制的,不同的浏览器存放大小不一样
 
 我们通过document.cookie来获取的当前网页下的cookie的时候,得到的是字符串形式的值,它包含了当前网站下所有的cookie
 
 我们如果想要长期存放cookie的话,需要在设置cookie的时候设置过期时间
cookie默认是临时存储的,当浏览器关闭进程的时候自动销毁
 * */
	
//设置cookie
//document.cookie="名称=值";
//document.cookie="username=leo";
//document.cookie="age=18";

//设置过期日期
//内容最好编码存放,encodeURI
//document.cookie="名称=值;expires="+字符串格式的时间;
//var oDate=new Date();
//oDate.setDate(oDate.getDate()+5);
//document.cookie="username="+encodeURI("leo\你好")+";expires="+oDate.toGMTString();
//alert(document.cookie);


//cookie记录用户名
var txt=document.getElementById("txt");
var login=document.getElementById("login");
var del=document.getElementById("del");

//判断是否有用户名cookie值,有的话让用户名显示
if (getCookie('username')) {
	txt.value=getCookie('username');
}

//点击登录按钮设置cookie记录用户名
login.onclick=function(){
	alert("登录成功");
	setCookie('username',txt.value,10);
}
//删除cookie级用户名
del.onclick=function(){
	removeCookie('username');
	txt.value="";
}



//cookie封装函数
//设置cookie
function setCookie(Key,value,t){
	var oDate=new Date();
	oDate.setDate(oDate.getDate()+t);
	document.cookie= Key+'='+value+';expires='+oDate.toGMTString();
}
//删除cookie
function removeCookie(Key){
	setCookie(Key,'',-1)
}
//读取cookie
function getCookie(key){
	var arr1=document.cookie.split(';');
	for (var i=0;i<arr1.length;i++) {
		var arr2=arr1[i].split('=');
		if(arr2[0]==key){
			return decodeURI(arr2[1]);
		}
	}
}

  

posted @ 2018-01-02 14:24  carol72  阅读(128)  评论(0编辑  收藏  举报