今天把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>

JavaScript如何读写cookie的更多相关文章

  1. JS读写Cookie（设置、读取、删除）

    JS读写Cookie(设置.读取.删除) Cookie是客户端存放数据的一种方式,可用来做状态保持. 1.设置Cookie: a.无过期时间:(若不设置过期时间,默认为会话级Cookie,浏览器关闭就 ...

  2. 两种方法使用js读写cookie实现一个底部广告浮层效果

    下面一个案例实现了js实现一个页面浮层并且使用两种方法使用js读写cookie:来实现用户关闭广告的显示状态: 读者可以将下面代码复制到一个html文件试试效果:html的pre标签未两种js实现的方 ...

  3. Javascript中关于cookie的那些事儿

    Javascript-cookie 什么是cookie? 指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).简单点来说就是:浏览器缓存. cookie由什 ...

  4. JavaScript学习08 Cookie对象

    JavaScript学习08 Cookie对象 JavaScript Cookie Cookie对象: Cookie是一种以文件的形式保存在客户端硬盘的Cookies文件夹中的用户数据信息(Cooki ...

  5. JS读写cookie以及中文乱码解决

    本文地址:http://www.cnblogs.com/PiaoMiaoGongZi/p/4092489.html 转载请注明. Js获取所有的cookie信息: var cookiename = d ...

  6. JavaScript创建读取cookie代码示例【附：跨域cookie解决办法】

    使用JavaScript 原生存取cookie代码示例: var cookie = { set : function(name, value, expires, path, domain, secur ...

  7. 学习笔记： JavaScript/JQuery 的cookie操作

    转自:http://blog.csdn.net/barryhappy/archive/2011/04/27/6367994.aspx cookie是网页存储到用户硬盘上的一小段信息.最常见的作用是判断 ...

  8. PHP与JavaScript下的Cookie操作

    下面的例子列出几种情形交互场景,列出JS和php交互的方法.总结下,以免日后再为cookie问题困扰. setcookie.php getcookie.php 总结: php用自身函数读取php 的c ...

  9. wcf读写cookie

    一般来说,web应用的服务端(aspx或mvc的action)调用wcf时,是一个服务与服务的通讯,而不是客户端(浏览器)与服务器的通讯. 这种情况下,如果要在wcf端处理客户端的cookie,就需要 ...

随机推荐

  1. 命名空间“Microsoft.Office”中不存在类型或命名空间名称“Interop”(是否缺少程序集引用?

    在一个web项目中需要导出word打印,引用Microsoft.Office.Interop.Word后,在pages里使用正常,在app_code里新建类引用就报错. Report.cs里using ...

  2. java多线程批量读取文件(七)

    新公司入职一个多月了,至今没有事情可以做,十来个新同事都一样抓狂,所以大家都自己学习一些新东西,我最近在看zookeeper,感觉蛮不错的,和微服务的zuul以及eureka功能类似,只是代码复杂了一 ...

  3. c++ function和bind

    bind 定义在头文件 functional 里 template<typename _Func, typename... _BoundArgs> inline typename _Bin ...

  4. Pandas 基本技巧

    1.数据查看和转置 import numpy as np import pandas as pd # 导入numpy.pandas模块 # 数据查看.转置 df = pd.DataFrame(np.r ...

  5. [USACO12JAN]视频游戏的连击Video Game Combos(AC自动机+DP)

    Description 贝西正在打格斗游戏.游戏里只有三个按键,分别是“A”.“B”和“C”.游戏中有 N 种连击 模式,第 i 种连击模式以字符串 Si 表示,只要贝西的按键中出现了这个字符串,就算 ...

  6. Ubuntu 16.04上安装并配置Postfix作为只发送SMTP服务器

    如果大家已经在使用第三方邮件服务方案发送并收取邮件,则无需运行自己的邮件服务器.然而,如果大家管理一套云服务器,且其中安装的应用需要发送邮件通知,那么运行一套本地只发送SMTP服务器则更为理想. 如何 ...

  7. [bzoj2733]永无乡&&[bzoj3545]Peaks

    并不敢说完全会了线段树合并,只是至少知道原理写法了...还是太菜了,每天被大佬吊锤qwq 我看到的几道线段树合并都是权值线段树的合并.这个算法适用范围应该只是01线段树的. 这两道算入门题了吧... ...

  8. SpringBoot推荐基础包

    技术交流群:233513714 Spring Boot 推荐的基础包 名称 说明 spring-boot-starter 核心 POM,包含自动配置支持.日志库和对 YAML 配置文件的支持. spr ...

  9. SpringMVC集成RSA加密算法

    技术交流群: 233513714 本文介绍的是RSA加密算法+Spring Security在SpringMVC中的集成使用. Spring Security是什么? 引用: Spring Secur ...

  10. 《Cracking the Coding Interview》——第8章：面向对象设计——题目8

    2014-04-23 23:49 题目:有个棋牌游戏叫Othello,也叫Reversi.请看游戏规则.中文应该叫黑白棋吧,不常玩儿就是了. 解法:既然这题的规则很清楚,也很清楚,我就写了一个命令行的 ...