今天把javascript如何用来创建及存储cookie复习了一下,其中的一点体会拿出来和大家讨论,首先看一下基础知识:

什么是cookie

cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

有关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部分代码:

01 //创建cookie
02 function setCookie(name, value, expireday) {
03     var exp = new Date();
04     exp.setTime(exp.getTime() + expireday*24*60*60*1000); //设置cookie的期限
05     document.cookie = name+"="+escape(value)+"; expires"+"="+exp.toGMTString();//创建cookie
06 }
07 //提取cookie中的值
08 function getCookie(name) {
09     var cookieStr = document.cookie;
10     if(cookieStr.length > 0) {
11         var cookieArr = cookieStr.split(";"); //将cookie信息转换成数组
12         for (var i=0; i<cookieArr.length; i++) {
13             var cookieVal = cookieArr[i].split("="); //将每一组cookie(cookie名和值)也转换成数组
14             if(cookieVal[0] == name) {
15                 return unescape(cookieVal[1]); //返回需要提取的cookie值
16             }
17         }
18     }
19 }
20 //测试cookie
21 function checkCookie() {
22     var cookieUser = document.getElementById("cookieUser");
23     var userName = getCookie("userName");
24     if(userName) {
25         cookieUser.innerHTML = "您好"+userName+",欢迎再次回来!";
26     } else {
27         var value = prompt("请输入用户名", "");
28         if(value) {
29             setCookie('userName', value, 1);
30         } else {
31             alert("请输入用户名!");
32         }
33     }
34 }

主要在于如何提取我们需要的cookie信息,在本例的getCookie函数中主要是将cookie信息转化成数组的方式来查找我们需要提取的cookie值。还可以通过正则表达式的方式来匹配,如下:

1 function getCookie(name) {
2     var cookieStr = document.cookie;
3     var cookieArr = cookieStr.match(new RegExp(name+"=[a-zA-Z0-9]*;$"));
4     var cookieVal = cookieArr.split("=");
5     if(cookieVal[0] == name) {
6         return unescape(cookieVal[1]);
7     }
8 }

比如在这个例子中,如果打开浏览器中没有存储名为userName的cookie,则会提示用户输入用户名,再次刷新页面时则会显示输入的cookie值。 最后我们可以测试一下代码:

1 <body onload="checkCookie()">
2 <p id="cookieUser"></p>
3 </body>

cookie 是存储于访问者的计算机中的变量的更多相关文章

  1. 1、JavaScript中的Cookie 用于存储 web 页面的用户信息。

    总结:每个浏览器都有一定数量限制的cookie.每个浏览器中,每一个cookie都有一个path路径,指向请求访问的网页. -------------------------------------- ...

  2. java 20 - 8 字节流的文件复制以及汉字在计算机中的存储方式

    复制文本文件:把当前目录下的FileIntputStream.java文件里面的内容复制到当前目录的b.txt文件中 分析: 数据源: FileIntputStream.java -- 读取数据 -- ...

  3. PHP-中文在计算机中的存储

    经常我们打开外国网站的时候出现乱码,又或者打开很多非英语的外国网站的时候,显示的都是口口口口口的字符, WordPress程序是用的UTF-8,很多cms用的是GB2312. ● 为什么有这么多编码? ...

  4. 4、Servlet中的Cookie 用于存储 web 页面的用户信息。

    Servlet Cookie 处理 Cookie 是存储在客户端计算机上的文本文件,并保留了各种跟踪信息.Java Servlet 显然支持 HTTP Cookie. 识别返回用户包括三个步骤: 服务 ...

  5. Cookie是存储在客户端上的一小段数据

    背景 在HTTP协议的定义中,采用了一种机制来记录客户端和服务器端交互的信息,这种机制被称为cookie,cookie规范定义了服务器和客户端交互信息的格式.生存期.使用范围.安全性. 在JavaSc ...

  6. 计算机中位(bit), 字节(byte), 字(word)的关系

    1.位(bit) 来自英文bit,音译为“比特”,表示二进制位.位是计算机内部数据储存的最小单位,11010100是一个8位二进制数.一个二进制位只可以表示0和1两种状态(21):两个二进制位可以表示 ...

  7. 计算机中的颜色XIV——快速变换颜色的V分量

    基本知识回顾: 计算机中的颜色Color,用RGB模式存储(用R.G.B三个分量表示颜色,每个分量的范围是0—255). 而计算机中的颜色除了用RGB模式表示以外,常见的还有HSV模式(或者是HSB. ...

  8. 当向计算机中存入一个float类型的数值2.2 后,在从计算机中读出输出,这时2.2 的值已经发生了变化(转)

    problom : 'f1' value hava been changed when output. reason : the binary repersentation of 2.2f is : ...

  9. 聊聊计算机中的编码(Unicode,GBK,ASCII,utf8,utf16,ISO8859-1等)以及乱码问题的解决办法

    作为一个程序员,一个中国的程序员,想来“乱码”问题基本上都遇到过,也为之头疼过.出现乱码问题的根本原因是编码与解码使用了不同而且不兼容的“标准”,在国内一般出现在中文的编解码过程中. 我们平时常见的编 ...

随机推荐

  1. (数据科学学习手札14)Mean-Shift聚类法简单介绍及Python实现

    不管之前介绍的K-means还是K-medoids聚类,都得事先确定聚类簇的个数,而且肘部法则也并不是万能的,总会遇到难以抉择的情况,而本篇将要介绍的Mean-Shift聚类法就可以自动确定k的个数, ...

  2. 将List中的数据更新到数据库中

    List中有相应的数据,更新到数据库如下: 1.根据关键字查找后删除: foreach (var item in objSelList) { ADDaAn da = db.ADDaAns.Find(i ...

  3. NB-IOT的键值对

    1. 关于NB-IOT的软件开发,有一个功能,NB收到数据的时候可以唤醒处于低功耗下的MCU. 2. 2个键值对可以配置这个功能.使用键值对的方式. 3. 遇到的第一个问题,<config> ...

  4. Mootools 学习随笔

    简单的介绍下Mootools: MooTools是一个简洁,模块化,面向对象的开源JavaScript web应用框架.在处理js.css.html时候,为web开发者提供了一个跨浏览器的js解决方案 ...

  5. jmeter-maven-plugin

    Maven编译JMeter, 使用的是jmeter-maven-plugin插件: <?xml version="1.0" encoding="UTF-8" ...

  6. 13.0 Excel表格写入

    Excel表格写入 安装 xlutils 和 xlwt Excel写入输入 分两种方式: 第一种是向一张新表之中写入..这种不多说,我几乎没怎么用,直接贴代码 import xlwt Excel_na ...

  7. 深入Python的类和对象

    多态:不同的子类对象,可以调用相同的父类方法,通过改写父类的方法,产生不同的执行结果 instance和type的区别: instance能够顺延到父类,比对对象与父类是否类型一致.而type只能比对 ...

  8. C++ STL容器——stack用法介绍

    stack是一种容器适配器,专门设计用于在LIFO上下文中操作(后进先出),其中元素仅从容器的一端插入和删除. 容器适配器,而不是一种容器. 它是容器适配器是指,只要支持一系列方法的容器(empty, ...

  9. z 变换

    1. z 变换 单位脉冲响应为 \(h[n]\) 的离散时间线性时不变系统对复指数输入 \(z^n\) 的响应 \(y[n]\) 为 \[ \tag{1} y[n] = H(z) z^{n}\] 式中 ...

  10. pandas DataFrame行或列的删除方法

    pandas DataFrame的增删查改总结系列文章: pandas DaFrame的创建方法 pandas DataFrame的查询方法 pandas DataFrame行或列的删除方法 pand ...