脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → JavaScript中cookie工具函数封装

JavaScript中cookie工具函数封装的示例代码

 更新时间：2016年10月11日 11:50:42   作者：子匠_Zijor  
这篇文章给大家主要介绍了JavaScript中cookie工具函数的封装，文中给出了详细的实现步骤和示例代码，相信会对大家的理解很有帮助，有需要的朋友们下面来一起看看吧。

一. 语法

1.1 获取当前页面的所有cookie：

var allCookies = document.cookie;

allCookies 是一个字符串，其中包含了以分号分隔的cookie列表字符串 (即 key=value 键值对)。

1.2 写一个新cookie：

document.cookie = updatedCookie;

updatedCookie是一个键值对形式的字符串。只能用这个方法一次设置或更新一个cookie，而且写入并不是覆盖，而是添加。例如：

document.cookie = "fontSize=14";
document.cookie = "fontSize=16";
document.cookie = "fontColor=black";

document.cookie; // fontSize=16;fontColor=black

1.3 可选属性：

除了Cookie本身的内容，还有一些可选的属性也是可以写入的，定义cookie的设定/更新，跟着一个分号以作分隔：

Set-Cookie: value[; expires=date][; domain=domain][; path=path][; secure]

     (1) path=path (例如 ‘/', ‘/mydir') 如果没有定义，默认为当前文档位置的路径。

     (2) domain=domain (例如 ‘example.com'， ‘.example.com' (包括所有子域名), ‘subdomain.example.com') 如果没有定义，默认为当前文档位置的路径的域名部分。

     (3) max-age=max-age-in-seconds (例如一年为606024*365)

     (4) expires=date-in-GMTString-format 如果没有定义，cookie会在对话结束时过期。这个值的格式参见Date.toUTCString() 。

     (5) secure (cookie只通过https协议传输) cookie的值字符串可以用encodeURIComponent()来保证它不包含任何逗号、分号或空格(cookie值中禁止使用这些值)。

二. cookie的接口封装：

var cookieUtil = {
  // 设置cookie
  setItem: function(name, value, days) {
    var date=new Date();
    date.setDate(date.getDate()+days);
    document.cookie=name+'='+value+';expires='+date;
  },

  // 获取cookie
  getItem: function(name) {
     var arr=document.cookie.replace(/\s/g, "").split(';');
     for(var i=0;i<arr.length;i++) {
       var tempArr=arr[i].split('=');
       if(tempArr[0]==name) {
        return decodeURIComponent(tempArr[1]);
       }
     }
     return '';
  },

  // 删除cookie
  removeItem: function(name) {
    this.setItem(name,'1', -1);
  },

  // 检查是否含有某cookie
  hasItem: function(name) {
    return (new RegExp("(?:^|;\\s*)" + encodeURIComponent(name).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie);
  },

  // 获取全部的cookie列表
  getAllItems: function() {
    var cookieArr = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
    for (var nIdx = 0; nIdx < cookieArr.length; nIdx++) { cookieArr[nIdx] = decodeURIComponent(cookieArr[nIdx]); }
    return cookieArr;
  }
};

总结

以上就是JavaScript中cookie工具函数封装的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。

您可能感兴趣的文章:

相关文章

  • 深入浅出分析javaScript中this用法

    深入浅出分析javaScript中this用法

    这篇文章主要介绍了javaScript中this用法,实例分析了javascript中this的用途与相关的使用技巧,需要的朋友可以参考下
    2015-05-05
  • Javascript中对象继承的实现小例

    Javascript中对象继承的实现小例

    这篇文章主要介绍了Javascript中对象继承的实现,需要的朋友可以参考下
    2014-05-05
  • javascript 层隐藏和显示的代码

    javascript 层隐藏和显示的代码

    javascript 层隐藏和显示的代码
    2009-07-07
  • js判断非127开头的IP地址的实例代码

    js判断非127开头的IP地址的实例代码

    这篇文章主要介绍了js判断非127开头的IP地址,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
    2020-01-01
  • js 下拉菜单实现代码

    js 下拉菜单实现代码

    js 下拉菜单实现代码，原理比较简单，需要的朋友可以参考下，具体的美化要靠自己。
    2010-05-05
  • UniApp使用vue.config.js进行配置的详细教程

    UniApp使用vue.config.js进行配置的详细教程

    这篇文章主要给大家介绍了关于UniApp使用vue.config.js进行配置的详细教程,uniapp是一套基于Vue语法的框架,同样也支持Vue.config.js配置,一般常用的莫过于路径的名称,需要的朋友可以参考下
    2023-10-10
  • 微信小程序按钮巧妙用法

    微信小程序按钮巧妙用法

    这篇文章主要介绍了微信小程序按钮巧妙用法,按钮组件功能比 HTML 中的 button 按钮丰富，通过 open-type 属性可以调用微信提供的各种功能（客服、转发、获取用户授权、获取用户信息等），需要的朋友可以参考下
    2022-12-12
  • 微信小程序常用表单组件的使用详解

    微信小程序常用表单组件的使用详解

    本文主要为大家介绍了微信小程序中常用的几个表单组件的使用方法，例如：button、CheckBox、input、form等，感兴趣的可以了解一下
    2022-03-03
  • uniapp小程序点击输入框时阻止弹出软键盘的几种解决方案

    uniapp小程序点击输入框时阻止弹出软键盘的几种解决方案

    在写项目时候需要在表单里面加一个picker选择器,但选择input的时候软键盘与选择器会同时弹出,下面这篇文章主要给大家介绍了关于uniapp小程序点击输入框时阻止弹出软键盘的几种解决方案,需要的朋友可以参考下
    2024-02-02
  • 实现无刷新联动例子汇总

    实现无刷新联动例子汇总

    最近在用asp.net做项目的时候，遇到需要实现无刷新联动的需求，度娘了一下，这里汇总一下几个比较实用的例子，有需要的小伙伴可以参考下。
    2015-05-05

最新评论