cookie特点:
1. 如登陆信息存储,同一论坛打开多个页面不用重复登陆,就是通过cookie来存取实现;
2. 正常情况下,关闭浏览器,相应cookie信息会清除;
3. 若设置了cookie的过期时间,关闭浏览器不会清除数据,只有到期清除,也可以手动清除;
应用:
如邮箱登陆后,记住用户名
拖拽后记住位置
cookie封装函数(可以直接使用):
// 开始----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
//存入cookie
function
setCookie(name, value, iDay){
//name:cookie名字; value:cookie值; iDay:缓存天数
var oDate=new Date();
oDate.setDate(oDate.getDate()+iDay);
document.cookie=name+‘=‘+value+‘;expires=‘+oDate;
}
//取出
function
getCookie(name){
//‘username=abc; password=123456; aaa=123; bbb=4r4er‘
var arr=document.cookie.split(‘; ‘); //以分号加空格进行分割,结果:arr->[‘username=abc‘, ‘password=123456‘, ...]
for(i=0;i<arr.length;i++){
var arr2=arr[i].split(‘=‘); //再次分割出名字进行比较,找到就返回相应的值,未找到就返回空
if(arr2[0]==name){
return arr2[1];
}
}
return ‘‘;
}
//删除
function
removeCookie(name){
setCookie(name,‘1‘,-1); //设置对应的为昨天过期即可
}
// 结束----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
// 使用测试-----------------------------------------------------------------
setCookie(‘username‘,‘sdd‘,‘10‘); //设置
setCookie(‘password‘,‘sdd2‘);
alert(document.cookie); //查看
alert(getCookie(‘username‘)); //查看指定的
removeCookie(‘username‘);
alert(getCookie(‘username‘)); //删除指定的
// 记住用户名功能(需要加载上面三个cookie函数) =============================================================
window.onload=function(){
var oForm=document.getElementById(‘form1‘);
var oUser=document.getElementsByTagName(‘user‘)[0]; //input的name可以作为TagName来选择
var oBtnclear=document.getElementsByTagName(‘a‘)[0];
oForm.onsubmit=function(){
setCookie(‘user‘,oUser.value,30);
};
oUser.value=getCookie(‘user‘);
oBtnClear.onclick=function(){
removeCookie(‘user‘);
oUser.value=‘‘;
};
}
<form id="form1" action="http://www.miaov.com/">
用户名:<input type="text" name="user" />
密码:<input type="password" name="pass" />
<input type="submit" value="登录" />
<a href="javascript:;">清除记录</a>
</form>