JS设置cookie、读取cookie、删除cookie

JavaScript是运行在客户端的脚本，因此一般是不能够设置Session的，因为Session是运行在服务器端的。

而cookie是运行在客户端的，所以可以用JS来设置cookie.

假设有这样一种情况，在某个用例流程中，由A页面跳至B页面，若在A页面中采用JS用变量temp保存了某一变量的值，在B页面的时候，同样需要使用JS来引用temp的变量值，对于JS中的全局变量或者静态变量的生命周期是有限的，当发生页面跳转或者页面关闭的时候，这些变量的值会重新载入，即没有达到保存的效果。解决这个问题的最好的方案是采用cookie来保存该变量的值，那么如何来设置和读取cookie呢？

首先需要稍微了解一下cookie的结构，简单地说：cookie是以键值对的形式保存的，即key=value的格式。各个cookie之间一般是以“;”分隔。

JS设置cookie:

假设在A页面中要保存变量username的值("jack")到cookie中,key值为name，则相应的JS代码为：

代码如下:

document.cookie="name="+username;

JS读取cookie:

假设cookie中存储的内容为：name=jack;password=123

则在B页面中获取变量username的值的JS代码如下：

var username=document.cookie.split(";")[0].split("=")[1];
//JS操作cookies方法!
//写cookies
function setCookie(name,value)
{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

读取cookies

function getCookie(name)
{
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}

删除cookies

function delCookie(name)
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
//使用示例
setCookie("name","hayden");
alert(getCookie("name"));
//如果需要设定自定义过期时间
//那么把上面的setCookie　函数换成下面两个函数就ok;
//程序代码
function setCookie(name,value,time)
{
var strsec = getsec(time);
var exp = new Date();
exp.setTime(exp.getTime() + strsec*1);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getsec(str)
{
alert(str);
var str1=str.substring(1,str.length)*1;
var str2=str.substring(0,1);
if (str2=="s")
{
return str1*1000;
}
else if (str2=="h")
{
return str1*60*60*1000;
}
else if (str2=="d")
{
return str1*24*60*60*1000;
}
}
//这是有设定过期时间的使用示例：
//s20是代表20秒
//h是指小时，如12小时则是：h12
//d是天数，30天则：d30
setCookie("name","hayden","s20");

以上所述就是本文的全部内容了，希望大家能够喜欢。

赞 (0)

相关推荐

  • js中cookie的使用详细分析

    cookie概述 在上一节,曾经利用一个不变的框架来存储购物栏数据,而商品显示页面是不断变化的,尽管这样能达到一个模拟 全局变量的功能,但并不严谨.例如在导航框架页面内右击,单击快捷菜单中的[刷新]命令,则所有的JavaScript变量都会丢失.因此,要实现严格的 跨页面全局变量,这种方式是不行的, JavaScript中的另一个机制:cookie,则可以达到真正全局变量的要求. cookie是浏览器提供的一种机制,它将document 对象的cookie属性提供给JavaScript.可以由J

  • Javascript读取cookie函数代码

    用法: 一.设置cookie 复制代码 代码如下: var cookie = new JSCookie(); // 普通设置 cookie .SetCookie("key1","val1"); // 过期时间为一年 var expire_time = new Date(); expire_time.setFullYear(expire_time.getFullYear() + 1); cookie .SetCookie("key2","

  • JS操作Cookies包括(读取添加与删除)

    一直都是简单去js实现cookie的一些操作,今天把js对cookie操作系统的整理了一遍,包括:js读取cookie,js添加cookie,js删除cookie,示例如下: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http

  • javascript 中Cookie读、写与删除操作

     javascript 中Cookie读.写与删除操作 前言: 在这个前端横行的时候,页面之间的交互需要数据的传递,有的数据通过url传参的形式可以很好地解决,但是对于部分需要改变的参数,你如说从页面A到页面B选择数据,然后从页面B将数据再传到页面A(典型的栗子就是收货地址的选择),针对这一块我是通过存储cookie来解决的. 对于cookie的操作我给出了一些简单的封装,当然也借鉴了前辈们经验,自己糅合了一下,对于cookie的操作,无非是读写和删除,我们首先来看一下写的操作,有写才有读,进而

  • JS实现清除指定cookies的方法

    本文实例讲述了JS实现清除指定cookies的方法,非常实用.分享给大家供大家参考. 具体实现代码如下: function GetCookieValue(name) { var cookieValue = null; if (document.cookie && document.cookie != '') { var cookies = document.cookie.split(';'); for (var i = 0; i < cookies.length; i++) { va

  • Javascript操纵Cookie实现购物车程序

    复制代码 代码如下: /***************************************************************************************************** Name 购物车 Version 1.1 Author Vanni(凡林) url:www.27sea.com QQ:303590170 CreateDate 2005-05-31 Description 此类是基于JavaScript和客户端Cookie,请保证客户端开

  • js删除所有的cookie的代码

    复制代码 代码如下: function clearCookie(){ var keys=document.cookie.match(/[^ =;]+(?=\=)/g); if (keys) { for (var i = keys.length; i--;) document.cookie=keys[i]+'=0;expires=' + new Date( 0).toUTCString() } }

  • JS cookie中文乱码解决方法

    复制代码 代码如下: function SetCookie(name, value) {        var exp = new Date();        exp.setTime(exp.getTime() + 3 * 24 * 60 * 60 * 1000); //3天过期        document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();       

  • js读取cookie方法总结

    本文实例总结了js读取cookie方法.分享给大家供大家参考.具体实现方法如下: 一般关于js读取cookie方法有很多,我们下面的实例函数主要是利用split函数来分切,和document.cookie获取所有cookie再利用for遍历所有数组,判断如果cookie名相同,那么这个cookie 就是我们要找的. 方法一 复制代码 代码如下: var acookie=document.cookie.split("; "); function getck(sname) {//获取单个c

  • 用js读、写、删除Cookie代码续篇

    上次的一篇文章:用js读.写.删除Cookie代码分享及详细注释说明,在实践中发现了一些问题: 1.cookie在本地文件上只能在火狐上调试,IE和chrome无效 2.cookie没有设置为永不过期,只考虑了设置一个时间段就过期,显然不太合理. 这次给出的是比较合理的cookie操作代码: 复制代码 代码如下: var Cookie = {     get: function (k) {         return ((new RegExp(["(?:; )?", k, "

  • vue中设置、获取、删除cookie的方法

    1.在src目录下的access下新建一个cookie.js, 内容如下: export function setCookie(c_name,value,expire) { var date=new Date() date.setSeconds(date.getSeconds()+expire) document.cookie=c_name+ "="+escape(value)+"; expires="+date.toGMTString() //console.lo

  • javascript实现设置、获取和删除Cookie的方法

    本文实例讲述了javascript实现设置.获取和删除Cookie的方法.分享给大家供大家参考.具体实现方法如下: /* *设置Cookie * * name:cookie所对应的键 * value:cookie所对应的值 * expires:cookie所对应的有效时间 * path:指定可访问cookie的路径 * domain:指定可访问cookie的主机名 * secure:安全性 */ function setCookie (name,value,expires,path,domain

  • jQuery获取cookie值及删除cookie用法实例

    本文实例讲述了jQuery获取cookie值及删除cookie用法.分享给大家供大家参考,具体如下: cookie在jquery中有指定的cookie操作类,这里先来介绍在使用cookie操作类时的一些问题,然后介绍正确的使用方法. 使用JQuery操作cookie时 发生取的值不正确的问题: 结果发现cookie有四个不同的属性: 名称,内容,域,路径 $.cookie('the_cookie'); // 读取 cookie $.cookie('the_cookie', 'the_value'

  • JS封装cookie操作函数实例(设置、读取、删除)

    本文实例讲述了JS封装cookie操作函数.分享给大家供大家参考,具体如下: /*设置cookie*/ function setCookie(name, value, iDay) { var oDate=new Date(); oDate.setDate(oDate.getDate()+iDay); document.cookie=name+'='+value+';expires='+oDate; }; /*使用方法:setCookie('user', 'simon', 11);*/ /*获取c

  • javascript操作Cookie（设置、读取、删除）方法详解

    Cookie是客户端存放数据的一种方式,可用来做状态保持. 1.设置Cookie: a.无过期时间:(若不设置过期时间,默认为会话级Cookie,浏览器关闭就会失效) 复制代码 代码如下: function setCookie(name,value) {     document.cookie = name + '=' + escape(value); } b.固定过期时间: 复制代码 代码如下: function setCookie(name,value) {     var Days = 3

  • JavaScript创建、读取和删除cookie

    JavaScript创建、读取和删除cookie

    Cookie 为 Web 应用程序保存用户相关信息提供了一种有用的方法.例如,当用户访问咱们的站点时,可以利用 Cookie 保存用户首选项或其他信息,这样,当用户下次再访问咱们的站点时,应用程序就可以检索以前保存的信息. Cookie 是什么鬼 Cookie 是一小段文本信息,伴随着用户请求和页面在 Web 服务器和浏览器之间传递.用户每次访问站点时,Web 应用程序都可以读取 Cookie 包含的信息. Cookie的出现是为了解决保存用户信息的问题.例如 当用户访问网页时,用户的名字可以存

  • 用js读、写、删除Cookie代码分享及详细注释说明

    复制代码 代码如下: //已经验证过// JavaScript Document//使用说明: //设置缓存:setCookie("name",value);//获取缓存:var name=getCookie("name");//删除缓存:delCookie("name");///设置cookiefunction setCookie(NameOfCookie, value, expiredays){ //@参数:三个变量用来设置新的cookie:

  • 在PHP中设置、使用、删除Cookie的解决方法

    1.设置Cookie PHP用SetCookie函数来设置Cookie.必须注意的一点是:Cookie是HTTP协议头的一部分,用于浏览器和服务器之间传递信息,所以必须在任何属于HTML文件本身的内容输出之前调用Cookie函数. SetCookie函数定义了一个Cookie,并且把它附加在HTTP头的后面,SetCookie函数的原型如下: int SetCookie(string name, string value, int expire, string path, string doma

  • javascript cookies 设置、读取、删除实例代码

    刚整理了一些关于javascript cookies操作的文章,发现这篇文章也不错,推荐大家一起参考,选择需要的,不足的地方主要是对路径的设置,喜欢的朋友可以结合下. 复制代码 代码如下: <script> function SetCookie(name,value)//两个参数,一个是cookie的名子,一个是值 { var Days = 30; //此 cookie 将被保存 30 天 var exp = new Date(); //new Date("December 31,

随机推荐