JS设置cookie、读取cookie

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

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

js设置cookie方法汇总：

第一种：

<script>
//设置cookie
function setCookie(cname, cvalue, exdays) {
 var d = new Date();
 d.setTime(d.getTime() + (exdays*24*60*60*1000));
 var expires = "expires="+d.toUTCString();
 document.cookie = cname + "=" + cvalue + "; " + expires;
}
//获取cookie
function getCookie(cname) {
 var name = cname + "=";
 var ca = document.cookie.split(';');
 for(var i=0; i<ca.length; i++) {
  var c = ca[i];
  while (c.charAt(0)==' ') c = c.substring(1);
  if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
 }
 return "";
}
//清除cookie
function clearCookie(name) {
 setCookie(name, "", -1);
}
function checkCookie() {
 var user = getCookie("username");
 if (user != "") {
  alert("Welcome again " + user);
 } else {
  user = prompt("Please enter your name:", "");
  if (user != "" && user != null) {
   setCookie("username", user, 365);
  }
 }
}
checkCookie();
</script>

第二种：

<script>
//JS操作cookies方法!

//写cookies
function setCookie(c_name, value, expiredays){
 　　　　var exdate=new Date();
　　　　exdate.setDate(exdate.getDate() + expiredays);
　　　　document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
 　　}

//读取cookies
function getCookie(name)
{
 var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");

 if(arr=document.cookie.match(reg))

  return (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('username','Darren',30)
alert(getCookie("username"));
</script>

第三个例子

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <head>
  <script language="JavaScript" type="text/javascript"> 

   function addCookie(objName, objValue, objHours){//添加cookie
    var str = objName + "=" + escape(objValue);
    if (objHours > 0) {//为0时不设定过期时间，浏览器关闭时cookie自动消失
     var date = new Date();
     var ms = objHours * 3600 * 1000;
     date.setTime(date.getTime() + ms);
     str += "; expires=" + date.toGMTString();
    }
    document.cookie = str;
    alert("添加cookie成功");
   } 

   function getCookie(objName){//获取指定名称的cookie的值
    var arrStr = document.cookie.split("; ");
    for (var i = 0; i < arrStr.length; i++) {
     var temp = arrStr[i].split("=");
     if (temp[0] == objName)
      return unescape(temp[1]);
    }
   } 

   function delCookie(name){//为了删除指定名称的cookie，可以将其过期时间设定为一个过去的时间
    var date = new Date();
    date.setTime(date.getTime() - 10000);
    document.cookie = name + "=a; expires=" + date.toGMTString();
   } 

   function allCookie(){//读取所有保存的cookie字符串
    var str = document.cookie;
    if (str == "") {
     str = "没有保存任何cookie";
    }
    alert(str);
   } 

   function $(m, n){
    return document.forms[m].elements[n].value;
   } 

   function add_(){
    var cookie_name = $("myform", "cookie_name");
    var cookie_value = $("myform", "cookie_value");
    var cookie_expireHours = $("myform", "cookie_expiresHours");
    addCookie(cookie_name, cookie_value, cookie_expireHours);
   } 

   function get_(){
    var cookie_name = $("myform", "cookie_name");
    var cookie_value = getCookie(cookie_name);
    alert(cookie_value);
   } 

   function del_(){
    var cookie_name = $("myform", "cookie_name");
    delCookie(cookie_name);
    alert("删除成功");
   }
  </script>
 </head>
 <body>
  <form name="myform">
   <div>
    <label for="cookie_name">
     名称
    </label>
    <input type="text" name="cookie_name" />
   </div>
   <div>
    <label for="cookie_value">
    值
    </lable>
    <input type="text" name="cookie_value" />
   </div>
   <div>
    <label for="cookie_expireHours">
    多少个小时过期
    </lable>
    <input type="text" name="cookie_expiresHours" />
   </div>
   <div>
    <input type="button" value="添加该cookie" onclick="add_()"/><input type="button" value="读取所有cookie" onclick="allCookie()"/><input type="button" value="读取该名称cookie" onclick="get_()"/><input type="button" value="删除该名称cookie" onclick="del_()"/>
   </div>
  </form>
</body>
</html>

注意：

chrome浏览器在本地获取不到cookie。必须在服务器上才可以。如果是本地的话，你可以放到local的www目录下面。

Google Chrome只支持在线网站的cookie的读写操作，对本地html的cookie操作是禁止的。所以下面的代码如果你写在一个本地的html文件中，将弹出的对话框内容为空。

document.cookie = "Test=cooo";
alert(document.cookie);

如果这个页面是在线网站的内容，则会正常显示cookie内容Test=cooo等等。

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

赞 (0)

相关推荐

  • 通过Jquery.cookie.js实现展示浏览网页的历史记录超管用

    本文就是要利用cookie插件,获取用户浏览文章历史记录,并将用户最近浏览历史记录显示在页面. 在需要添加cookie的页面加上如下js <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.cookie.js"></script

  • javascript cookie的简单应用

    在我平时开发网页的过程中,可能涉及到浏览器本地的存储,现在主流的浏览器存储方式有:cookie,直接读取xml,userData,H5 的LocalStorage等,Cookie存储数据有限,但对于数据量不大的时候操作还是比较方便的. 下面这个例子主要是实现在网页打开的时候弹出一个提示框,但第二次以后刷新网页不在显示提示框,当然可以灵活的设置cookie的时间,控制是否显示提示框. <!DOCTYPE html> <html> <head lang="en"

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

    JavaScript是运行在客户端的脚本,因此一般是不能够设置Session的,因为Session是运行在服务器端的. 而cookie是运行在客户端的,所以可以用JS来设置cookie. 假设有这样一种情况,在某个用例流程中,由A页面跳至B页面,若在A页面中采用JS用变量temp保存了某一变量的值,在B页面的时候,同样需要使用JS来引用temp的变量值,对于JS中的全局变量或者静态变量的生命周期是有限的,当发生页面跳转或者页面关闭的时候,这些变量的值会重新载入,即没有达到保存的效果.解决这个问题

  • JS通过Cookie判断页面是否为首次打开

    废话不多说了,直接给大家贴代码了,本文写的不好还请各位大侠见谅. JScript code: function Cookie(key,value) { this.key=key; if(value!=null) { this.value=escape(value); } this.expiresTime=null; this.domain=null; this.path="/"; this.secure=null; } Cookie.prototype.setValue=functio

  • JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面

    简单写了写,可根据指定参数Deadline格式的时间进行测试,如存在些不严谨的地方还请指出. // 设置cookie在当天指定时间点过期并提示 function setCookie(name,value,Deadline,callback){ // 获取当前日期对象 var curDate = new Date(); // 获取当前日期对应的时间戳 var curTime = curDate.getTime(); // 获取指定时间的时间戳 var endTime = convertTime(c

  • javascript创建cookie、读取cookie

    本文内容分为两个部分进行学习,分别介绍了javascript创建cookie.javascript读取cookie的具体实现方法,供大家学习,具体内容如下 一.创建Cookie document.cookie = 'key=value';  有特殊字符 使用encodeURIComponent() 进行编码 document.cookie = 'user='+encodeURIComponent('郭钱;');  读取时 使用decodeURIComponent() 例如: document.c

  • 设置和读取cookie的javascript代码

    function setcookie(name, value) { //设置名称为name,值为value的cookie document.cookie = name + "=" + value document.location.reload(); } function setCookie() { document.cookie="a=abcd;" document.cookie="b=5678;" document.location.relo

  • JS设置cookie、读取cookie

    JavaScript是运行在客户端的脚本,因此一般是不能够设置Session的,因为Session是运行在服务器端的. 而cookie是运行在客户端的,所以可以用JS来设置cookie. js设置cookie方法汇总: 第一种: <script> //设置cookie function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays*24*60*60*1000)); v

  • js读取cookie方法总结

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

  • js简单设置与使用cookie的方法

    本文实例讲述了js简单设置与使用cookie的方法.分享给大家供大家参考,具体如下: 一.js设置cookie的用处 php可以设置cookie的,用js来设置cookie有什么好处呢?在前端进行操作时,有的时候要传很多参数,这个时候,我们可以把这些参数拼接到url后面进行传值,那边在接收参数,不过这样挺麻烦的,如果把这些数据放到cookie里面,就开发者的开发效率来说,我想会高一些,以淘宝为例,他有一级分类,二级分类,三级,四级,我们找商品的时候,可能会牵扯到很多条件,如果把这些条件都放到co

  • JS 设置Cookie 有效期 检测cookie

    设置cookie 函数直接上代码: function setCookie(name, value, days) { //设置cookie var d = new Date(); d.setTime(d.getTime() + (days * 24 * 60 * 60 * 1000)); var expires = "expires=" + d.toUTCString(); document.cookie = name + "=" + value + ";

  • httpclient模拟登陆具体实现(使用js设置cookie)

    httpclient模拟登陆(使用js设置cookie) 复制代码 代码如下: <html> <meta http-equiv='Content-Type' content='text/html; charset=gb2312'> <link rel=stylesheet type=text/css href='/bbs.css'> <script>document.cookie='utmpnum=51;path=/;domain=.' + window.l

  • JS 中Json字符串+Cookie+localstorage

    JS 中Json字符串+Cookie+localstorage

    目录 1.Json字符串 1.1Json语法 1.2举例 2.Cookie 2.1怎么用? 3.Localstorage 3.1基本使用 3.2案例(记住用户名和密码) 1.Json字符串 Json主要用于前后端交互,是一种数据格式,相较于Xml,使用起来更加便捷 1.1Json语法 可以用来表示:对象.数组.简单数据类型等 {}表示对象 ,[]表示数组 键与值之间用 :隔开,键与键之间用,隔开,属性名必须使用""号 值尽量不要用NaN,属性的最后一位如果没有其他属性,不要留, Jso

  • JS 中Json字符串+Cookie+localstorage

    JS 中Json字符串+Cookie+localstorage

    目录 1.Json字符串 1.1Json语法 1.2举例 2.Cookie 2.1怎么用? 3.Localstorage 3.1基本使用 3.2案例(记住用户名和密码) 1.Json字符串 Json主要用于前后端交互,是一种数据格式,相较于Xml,使用起来更加便捷 1.1Json语法 可以用来表示:对象.数组.简单数据类型等 {}表示对象 ,[]表示数组 键与值之间用 :隔开,键与键之间用,隔开,属性名必须使用""号 值尽量不要用NaN,属性的最后一位如果没有其他属性,不要留, Jso

随机推荐