javascript cookie用法基础教程(概念,设置,读取及删除)
本文实例讲述了javascriptcookie用法。分享给大家供大家参考，具体如下：
一、什么是cookie？
cookie就是页面用来保存信息，比如自动登录、记住用户名等等。
二、cookie的特点
同个网站中所有的页面共享一套cookie
cookie有数量、大小限制
cookie有过期时间
三、如何使用cookie？
通过document.cookie来写入cookie
<!DOCTYPEHTML> <htmllang="en-US"> <head> <metacharset="UTF-8"> <title>cookie基础</title> </head> <body> </body> </html> <scripttype="text/javascript"> document.cookie='username=abc'; document.cookie='password=123'; document.cookie='email=abcdef@123.com'; </script>
打开浏览器查看cookie，可以发现新定义的cookie并不会将原来的覆盖。
如果没有设置过期时间，那么关闭浏览器就会清空cookie。如何设置过期时间呢？答案是：expires。一般我们会结合Date对象来使用。
vard=newDate(); d.setTime(d.getTime()+1*3600*1000); document.cookie='username=abc;expires='+d.toGMTString();
我们可以通过火狐浏览器看到，username的过期时间是当前时间的1小时后。
最后对获取cookie的方法进行封装：
functionsetCookie(name,value,hours){
vard=newDate();
d.setTime(d.getTime()+hours*3600*1000);
document.cookie=name+'='+value+';expires='+d.toGMTString();
}
学会了如何设置cookie，那么该如何读取cookie呢？
首先我们看下cookie里的内容是什么类型？
document.cookie='username=abc'; document.cookie='password=123'; document.cookie='email=abcdef@123.com'; typeofdocument.cookie;//string alert(document.cookie);//'username=abc;password=123;email=abcdef@123.com'
得到的是一串字符串，需要注意的是，每个;后面都有个空格。
那么我们如何取到具体的数值呢？附上代码：
functiongetCookie(name){
vararr=document.cookie.split(';');
for(vari=0;i<arr.length;i++){
vartemp=arr[i].split('=');
if(temp[0]==name){
returntemp[1];
}
}
return'';
}
除了设置、获取cookie，我们还可以删除cookie。我们在网上经常看到有清除用户名这样的功能，其实就是用到了清除cookie。
清除cookie其实很简单，只要使过期时间为过去时间就可以了。
functionremoveCookie(name){
vard=newDate();
d.setTime(d.getTime()-10000);
document.cookie=name+'=1;expires='+d.toGMTString();
}
最后我们将设置、获取、清除cookie封装成一个cookie.js
functionsetCookie(name,value,hours){
vard=newDate();
d.setTime(d.getTime()+hours*3600*1000);
document.cookie=name+'='+value+';expires='+d.toGMTString();
}
functiongetCookie(name){
vararr=document.cookie.split(';');
for(vari=0;i<arr.length;i++){
vartemp=arr[i].split('=');
if(temp[0]==name){
returntemp[1];
}
}
return'';
}
functionremoveCookie(name){
vard=newDate();
d.setTime(d.getTime()-10000);
document.cookie=name+'=1;expires='+d.toGMTString();
}
附：这里再补充一个关于cookie的基础应用：javascriptcookie记录用户名
更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。