javascript学习笔记(七)利用javascript来创建和存储cookie


Posted in Javascript onApril 08, 2011

首先看一下基础知识:
1、什么是cookie
cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值
2、有关cookie的例子:
•名字 cookie 当访问者首次访问页面时,他或她也许会填写他/她们的名字。名字会存储于 cookie 中。当访问者再次访问网站时,他们会收到类似 "Welcome John Doe!" 的欢迎词。而名字则是从 cookie 中取回的。
•密码 cookie 当访问者首次访问页面时,他或她也许会填写他/她们的密码。密码也可被存储于 cookie 中。当他们再次访问网站时,密码就会从 cookie 中取回。
•日期 cookie 当访问者首次访问你的网站时,当前的日期可存储于 cookie 中。当他们再次访问网站时,他们会收到类似这样的一条消息:"Your last visit was on Tuesday August 11, 2005!"。日期也是从 cookie 中取回的。
下面来创建一个cookie的实例,如何来创建cookie及取出cookie
javascript部分代码:

//创建cookie 
function setCookie(name, value, expireday) { 
var exp = new Date(); 
exp.setTime(exp.getTime() + expireday*24*60*60*1000); //设置cookie的期限 
document.cookie = name+"="+escape(value)+"; expires"+"="+exp.toGMTString();//创建cookie 
} 
//提取cookie中的值 
function getCookie(name) { 
var cookieStr = document.cookie; 
if(cookieStr.length > 0) { 
var cookieArr = cookieStr.split(";"); //将cookie信息转换成数组 
for (var i=0; i<cookieArr.length; i++) { 
var cookieVal = cookieArr[i].split("="); //将每一组cookie(cookie名和值)也转换成数组 
if(cookieVal[0] == name) { 
return unescape(cookieVal[1]); //返回需要提取的cookie值 
} 
} 
} 
} 
//测试cookie 
function checkCookie() { 
var cookieUser = document.getElementById("cookieUser"); 
var userName = getCookie("userName"); 
if(userName) { 
cookieUser.innerHTML = "您好"+userName+",欢迎再次回来!"; 
} else { 
var value = prompt("请输入用户名", ""); 
if(value) { 
setCookie('userName', value, 1); 
} else { 
alert("请输入用户名!"); 
} 
} 
}

主要在于如何提取我们需要的cookie信息,在本例的getCookie函数中主要是将cookie信息转化成数组的方式来查找我们需要提取的cookie值。还可以通过正则表达式的方式来匹配,如下:
function getCookie(name) { 
var cookieStr = document.cookie; 
var cookieArr = cookieStr.match(new RegExp(name+"=[a-zA-Z0-9]*;$")); 
var cookieVal = cookieArr.split("="); 
if(cookieVal[0] == name) { 
return unescape(cookieVal[1]); 
} 
}

比如在这个例子中,如果打开浏览器中没有存储名为userName的cookie,则会提示用户输入用户名,再次刷新页面时则会显示输入的cookie值。
最后我们可以测试一下代码:
<body onload="checkCookie()"> 
<p id="cookieUser"></p> 
</body>
Javascript 相关文章推荐
jquery控制listbox中项的移动并排序的实现代码
Sep 28 Javascript
js时间比较示例分享(日期比较)
Mar 05 Javascript
详解javascript中原始数据类型Null和Undefined
Dec 17 Javascript
详解javascript事件绑定使用方法
Oct 20 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
Oct 31 Javascript
基于js实现checkbox批量选中操作
Nov 22 Javascript
js实现截图保存图片功能的代码示例
Feb 16 Javascript
Angular.js中window.onload(),$(document).ready()的写法浅析
Sep 28 Javascript
微信小程序 页面滑动事件的实例详解
Oct 12 Javascript
vue.js数据绑定操作详解
Apr 23 Javascript
JavaScript 跨域之POST实现方法
May 07 Javascript
微信小程序 wx:for遍历循环使用实例解析
Sep 09 Javascript
javascript 学习笔记(六)浏览器类型及版本信息检测代码
Apr 08 #Javascript
javascript学习笔记(五)正则表达式
Apr 08 #Javascript
javascript学习笔记(三)显示当时时间的代码
Apr 08 #Javascript
javascript 学习笔记(一)DOM基本操作
Apr 08 #Javascript
jQuery 名称冲突的解决方法
Apr 08 #Javascript
js 事件处理函数间的Event物件是否全等
Apr 08 #Javascript
Javascript 八进制转义字符(8进制)
Apr 08 #Javascript
You might like
怎样在php中使用PDF文档功能
2006/10/09 PHP
浅谈php函数serialize()与unserialize()的使用方法
2014/08/19 PHP
ThinkPHP中create()方法自动验证实例
2017/04/26 PHP
PHP设计模式之工厂方法设计模式实例分析
2018/04/25 PHP
windows 2008r2+php5.6.28环境搭建详细过程
2019/06/18 PHP
phpstudy后门rce批量利用脚本的实现
2019/12/12 PHP
几款极品的javascript压缩混淆工具
2007/05/16 Javascript
javascript 面向对象全新理练之数据的封装
2009/12/03 Javascript
js内存泄露的几种情况详细探讨
2013/05/31 Javascript
基于BootStrap Metronic开发框架经验小结【四】Bootstrap图标的提取和利用
2016/05/12 Javascript
星期几的不同脚本写法(推荐)
2016/06/01 Javascript
jQuery常用样式操作实例分析(获取、设置、追加、删除、判断等)
2016/09/08 Javascript
JS中this上下文对象使用方式
2016/10/09 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
微信小程序实现swiper切换卡内嵌滚动条不显示的方法示例
2018/12/20 Javascript
产制造追溯系统之通过微信小程序实现移动端报表平台
2019/06/03 Javascript
react 生命周期实例分析
2020/05/18 Javascript
jQuery实现移动端笔触canvas电子签名
2020/05/21 jQuery
Vue 解决通过this.$refs来获取DOM或者组件报错问题
2020/07/28 Javascript
解决vue-router路由拦截造成死循环问题
2020/08/05 Javascript
[01:13:59]LGD vs Mineski Supermajor 胜者组 BO3 第三场 6.5
2018/06/06 DOTA
Python牛刀小试密码爆破
2011/02/03 Python
python操作MySQL 模拟简单银行转账操作
2017/09/27 Python
pycharm在调试python时执行其他语句的方法
2018/11/29 Python
python利用ffmpeg进行录制屏幕的方法
2019/01/10 Python
Pycharm之快速定位到某行快捷键的方法
2019/01/20 Python
Anaconda+spyder+pycharm的pytorch配置详解(GPU)
2020/10/18 Python
aden + anais官方网站:婴儿襁褓、毯子、尿布和服装
2017/06/21 全球购物
新西兰便宜隐形眼镜购买网站:QUICKLENS New Zealand
2019/03/02 全球购物
Nike瑞士官网:Nike CH
2021/01/18 全球购物
在C语言中"指针和数组等价"到底是什么意思?
2014/03/24 面试题
让生命充满爱演讲稿
2014/05/10 职场文书
党员民主评议总结
2014/10/20 职场文书
2014年教师业务工作总结
2014/12/19 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
Go 实现英尺和米的简单单位换算方式
2021/04/29 Golang