JS设置cookie、读取cookie


Posted in Javascript onFebruary 24, 2016

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等等。

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

Javascript 相关文章推荐
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
Feb 23 Javascript
Three.js源码阅读笔记(基础的核心Core对象)
Dec 27 Javascript
node.js中的http.response.writeHead方法使用说明
Dec 14 Javascript
jQuery模拟新浪微博首页滚动效果的方法
Mar 11 Javascript
浅谈jquery.fn.extend与jquery.extend区别
Jul 13 Javascript
jQuery实现选项卡切换效果简单演示
Dec 09 Javascript
使用 stylelint检查CSS_StyleLint
Apr 28 Javascript
使用JQuery中的trim()方法去掉前后空格
Sep 16 Javascript
jQuery Ajax全解析
Feb 13 Javascript
JavaScript实现简单轮播图效果
Dec 01 Javascript
layer.prompt输入层的例子
Sep 24 Javascript
vue 使用lodash实现对象数组深拷贝操作
Sep 10 Javascript
jquery form表单获取内容以及绑定数据
Feb 24 #Javascript
javascript cookie的简单应用
Feb 24 #Javascript
javascript的正则匹配方法学习
Feb 24 #Javascript
适用于javascript开发者的Processing.js入门教程
Feb 24 #Javascript
JavaScript设计模式经典之命令模式
Feb 24 #Javascript
JavaScript设计模式经典之工厂模式
Feb 24 #Javascript
JavaScript的设计模式经典之建造者模式
Feb 24 #Javascript
You might like
深入PHP数据加密详解
2013/06/18 PHP
Win2003+apache+PHP+SqlServer2008 配置生产环境
2014/07/29 PHP
php获取百度收录、百度热词及百度快照的方法
2015/04/02 PHP
通过Email发送PHP错误的方法
2015/07/20 PHP
PHP CURL采集百度搜寻结果图片不显示问题的解决方法
2017/02/03 PHP
PHP中模糊查询并关联三个select框
2017/06/19 PHP
php7新特性的理解和比较总结
2019/04/14 PHP
PHP单例模式实例分析【防继承,防克隆操作】
2019/05/22 PHP
event.srcElement+表格应用
2006/08/29 Javascript
jquery 学习之二 属性(html()与html(val))
2010/11/25 Javascript
在NodeJS中启用ECMAScript 6小结(windos以及Linux)
2014/07/15 NodeJs
基于jQuery实现文本框缩放以及上下移动功能
2014/11/24 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
2015/08/05 Javascript
jQuery实现返回顶部功能
2016/02/23 Javascript
文件上传,iframe跨域数据提交的实现
2016/11/18 Javascript
JS排序算法之希尔排序与快速排序实现方法
2017/12/12 Javascript
Vue仿微信app页面跳转动画效果
2019/08/21 Javascript
vue自定义正在加载动画的例子
2019/11/14 Javascript
JavaScript实现横版菜单栏
2020/03/17 Javascript
python中wx将图标显示在右下角的脚本代码
2013/03/08 Python
python list语法学习(带例子)
2013/11/01 Python
Ubuntu 下 vim 搭建python 环境 配置
2017/06/12 Python
Python基于回溯法子集树模板解决全排列问题示例
2017/09/07 Python
Python使用pyh生成HTML文档的方法示例
2018/03/10 Python
如何利用python查找电脑文件
2018/04/27 Python
python gdal安装与简单使用
2019/08/01 Python
通过实例简单了解Python sys.argv[]使用方法
2020/08/04 Python
Python 实现图片转字符画的示例(静态图片,gif皆可)
2020/11/05 Python
澳大利亚玩具剧场:Toy Playhouse
2019/03/03 全球购物
医药专业应届毕业生求职信范文
2014/01/01 职场文书
物业工作计划书
2014/01/10 职场文书
培训班开班仪式主持词
2014/03/28 职场文书
党员批评与自我批评范文
2014/09/23 职场文书
四风问题自我剖析材料
2014/10/07 职场文书
万能检讨书2000字
2014/10/17 职场文书
大学生心理健康教育心得体会
2016/01/12 职场文书