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 相关文章推荐
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
Feb 27 Javascript
jquery如何改变html标签的样式(两种实现方法)
Jan 16 Javascript
JavaScript实现Flash炫光波动特效
May 14 Javascript
将页面table内容与样式另存成excel文件的方法
Aug 05 Javascript
卸载安装Node.js与npm过程详解
Aug 15 Javascript
node.js中debug模块的简单介绍与使用
Apr 25 Javascript
vue中将网页打印成pdf实例代码
Jun 15 Javascript
微信小程序 数据绑定及运算的简单实例
Sep 20 Javascript
浅谈webpack对样式的处理
Jan 05 Javascript
VUE解决微信签名及SPA微信invalid signature问题(完美处理)
Mar 29 Javascript
layer提示框添加多个按钮选择的实例
Sep 12 Javascript
JavaScript实现简单的图片切换功能(实例代码)
Apr 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
晶体管来复再生式二管收音机
2021/03/02 无线电
三种php连接access数据库方法
2013/11/11 PHP
PHP生成随机字符串(3种方法)
2015/09/25 PHP
JSON两种结构之对象和数组的理解
2016/07/19 PHP
php简单生成一组与多组随机字符串的方法
2017/05/09 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
跨浏览器开发经验总结(四) 怎么写入剪贴板
2010/05/13 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
2012/12/25 Javascript
图片上传判断及预览脚本的效果实例
2013/08/07 Javascript
深入分析Cookie的安全性问题
2015/03/01 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
2015/10/09 Javascript
使用JQuery中的trim()方法去掉前后空格
2016/09/16 Javascript
Jquery实现上下移动和排序代码
2016/10/17 Javascript
微信小程序 教程之模块化
2016/10/17 Javascript
微信开发 消息推送实现代码
2016/10/21 Javascript
php简单数据库操作类的封装
2017/06/08 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
layui 优化button按钮和弹出框的方法
2018/08/15 Javascript
详解Python3.1版本带来的核心变化
2015/04/07 Python
在Python的Django框架中使用通用视图的方法
2015/07/21 Python
Python 绘图和可视化详细介绍
2017/02/11 Python
详解flask入门模板引擎
2018/07/18 Python
python中copy()与deepcopy()的区别小结
2018/08/03 Python
Python 3.3实现计算两个日期间隔秒数/天数的方法示例
2019/01/07 Python
简单了解Django ContentType内置组件
2019/07/23 Python
Python log模块logging记录打印用法解析
2020/01/20 Python
tensorflow 固定部分参数训练,只训练部分参数的实例
2020/01/20 Python
浅谈Python中的字符串
2020/06/10 Python
简单了解Python多态与属性运行原理
2020/06/15 Python
Glamest意大利:女性在线奢侈品零售店
2019/04/28 全球购物
描述RIP和OSPF区别以及特点
2015/01/17 面试题
公司股权转让协议书
2014/04/12 职场文书
篮球比赛口号
2014/06/10 职场文书
英文演讲稿开场白
2014/08/25 职场文书
讲文明知礼仪演讲稿
2014/09/13 职场文书
Javascript使用integrity属性进行安全验证
2021/11/07 Javascript