首页 web前端 js教程 javascript封装 Cookie 应用接口_javascript技巧

javascript封装 Cookie 应用接口_javascript技巧

May 16, 2016 pm 03:46 PM
cookie javascript 封装

本文章记录本人在学习 Cookie 中看书理解到的一些东西,加深记忆和并且整理记录下来,方便之后的复习。

封装函数

在默认的情况下存取Cookie是一件比较麻烦的事情。由于Cookie是通过字符串来存储信息的,所以容易导致在执行赋值运算的时需要转换读取信息的数据类型。而且Cookie信息的字符串本身就令人讨厌,在经常使用Cookie信息的 Web 应用中格外的不方便。所以需要自行的封装一个Cookie函数来提供开发效率!

定义一个函数Cookie(),这个函数能够写入指定的Cookie信息,删除指定的Cookie信息,也能够读取指定名称的Cookie值,另外,在该函数中还可以制定Cookie信息的有效期、有效路径、作用域和安全性选项设置。完整的代码:

var Cookie = function(name, value, options) {
    // 如果第二个参数存在
    if (typeof value != 'undefined') {
      options = options || {};
      if (value === null) {
        // 设置失效时间
        options.expires = -1;
      }
      var expires = '';
      // 如果存在事件参数项,并且类型为 number,或者具体的时间,那么分别设置事件
      if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
        var date;
        if (typeof options.expires == 'number') {
          date = new Date();
          date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
        } else {
          date = options.expires;
        }
        expires = '; expires=' + date.toUTCString();
      }
      var path = options.path ? '; path=' + options.path : '', // 设置路径
        domain = options.domain ? '; domain=' + options.domain : '', // 设置域 
        secure = options.secure ? '; secure' : ''; // 设置安全措施,为 true 则直接设置,否则为空

      // 把所有字符串信息都存入数组,然后调用 join() 方法转换为字符串,并写入 Cookie 信息
      document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); 
    } else { // 如果第二个参数不存在
      var CookieValue = null;
      if (document.cookie && document.cookie != '') {
        var Cookie = document.cookie.split(';');
        for (var i = 0; i < Cookies.length; i++) {
          var Cookie = (Cookie[i] || "").replace( /^\s+|\s+$/g, "");
          if (Cookie.substring(0, name.length + 1) == (name + '=')) {
            CookieValue = decodeURIComponent(Cookie.substring(name.length + 1));
            break;
          }
        }
      }
      return CookieValue;
    }
  };

登录后复制

如何使用

写入Cookie信息:

// 简单写入一条 Cookie 信息
cookie("user", "baidu");
// 写入一条 Cookie 信息,并且设置更多选项
cookie("user", "baidu", {
  expires: 10, // 有效期为 10 天
  path: "/", // 整个站点有效
  domain: "www.baidu.com", // 有效域名
  secure: true // 加密数据传输
});
登录后复制

2.读取Cookie信息:

cookie("user");
登录后复制

3.删除Cookie信息:

cookie("user", null);
登录后复制

再给大家分享一个封装好的代码

//向cookie写入数据
function writeCookie(name, value, days) {
 // 定义有效日期(cookie的有效时间)
 var expires = "";

 // 为有效日期赋值
 if (days) {
  var date = new Date();
	//设置有效期(当前时间+时间段)
  date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));//时间段为毫秒数 
  expires = "; expires=" + date.toGMTString();
 }

 // 给cookie赋值 name, value和expiration date(有效期)
 document.cookie = name + "=" + value + expires + "; path=/";
}
//读取cookie数据
function readCookie(name) {
 var searchName = name + "=";
 var cookies = document.cookie.split(';');
 for(var i=0; i < cookies.length; i++) {
  var c = cookies[i];
  while (c.charAt(0) == ' ')
   c = c.substring(1, c.length);
  if (c.indexOf(searchName) == 0)
   return c.substring(searchName.length, c.length);
 }
 return null;
}
//清楚所有的cookie
function eraseCookie(name) {
 // 将时间设置成-1将清除存储在cookie中的数据
 writeCookie(name, "", -1);
}
登录后复制

最后,如果文章有什么错误和疑问的地方,请指出。与sf各位共勉!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

电脑上的cookie在哪里 电脑上的cookie在哪里 Dec 22, 2023 pm 03:46 PM

电脑上的Cookie存储在浏览器的特定位置,具体位置取决于使用的浏览器和操作系统:1、Google Chrome, 存储在C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default\Cookies中等等。

cookie是存在哪里 cookie是存在哪里 Dec 20, 2023 pm 03:07 PM

Cookie通常存储在浏览器的Cookie文件夹中的,浏览器中的Cookie文件通常以二进制或SQLite格式存储,如果直接打开Cookie文件,可能会看到一些乱码或无法读取的内容,因此最好使用浏览器提供的Cookie管理界面来查看和管理Cookie。

手机cookie在哪里 手机cookie在哪里 Dec 22, 2023 pm 03:40 PM

手机上的Cookie存储在移动设备的浏览器应用程序中:1、在iOS设备上,Cookie存储在Safari浏览器的Settings -> Safari -> Advanced -> Website Data中;2、在Android设备上,Cookie 存储在Chrome浏览器的Settings -> Site settings -> Cookies中等等。

浏览器cookie的存储位置详解 浏览器cookie的存储位置详解 Jan 19, 2024 am 09:15 AM

随着互联网的普及,我们使用浏览器进行上网已经成为一种生活方式。在日常使用浏览器过程中,我们经常会遇到需要输入账号密码的情况,如网购、社交、邮件等。这些信息需要浏览器记录下来,以便于下次访问时不需要再次输入,这时候Cookie就派上了用场。什么是Cookie?Cookie是指由服务器端发送到用户浏览器上并存储在本地的一种小型数据文件,它包含了一些网站的用户行为

集邦咨询:英伟达 Blackwell 平台产品带动台积电今年 CoWoS 产能提高 150% 集邦咨询:英伟达 Blackwell 平台产品带动台积电今年 CoWoS 产能提高 150% Apr 17, 2024 pm 08:00 PM

本站4月17日消息,集邦咨询(TrendForce)近日发布报告,认为英伟达Blackwell新平台产品需求看涨,预估带动台积电2024年CoWoS封装总产能提升逾150%。英伟达Blackwell新平台产品包括B系列的GPU,以及整合英伟达自家GraceArmCPU的GB200加速卡等。集邦咨询确认为供应链当前非常看好GB200,预估2025年出货量有望超过百万片,在英伟达高端GPU中的占比达到40-50%。在英伟达计划下半年交付GB200以及B100等产品,但上游晶圆封装方面须进一步采用更复

简易JavaScript教程:获取HTTP状态码的方法 简易JavaScript教程:获取HTTP状态码的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教程:如何获取HTTP状态码,需要具体代码示例前言:在Web开发中,经常会涉及到与服务器进行数据交互的场景。在与服务器进行通信时,我们经常需要获取返回的HTTP状态码来判断操作是否成功,根据不同的状态码来进行相应的处理。本篇文章将教你如何使用JavaScript获取HTTP状态码,并提供一些实用的代码示例。使用XMLHttpRequest

AMD 'Strix Halo” FP11 封装尺寸曝光:和英特尔 LGA1700 相当,比 Phoenix 大 60% AMD 'Strix Halo” FP11 封装尺寸曝光:和英特尔 LGA1700 相当,比 Phoenix 大 60% Jul 18, 2024 am 02:04 AM

本站7月9日消息,AMDZen5架构“Strix”系列处理器会有两种封装方案,其中较小的StrixPoint将采用FP8封装,而StrixHalo将会采用FP11封装。图源:videocardz消息源@Olrak29_最新曝料称StrixHalo的FP11封装尺寸为37.5mm*45mm(1687平方毫米),和英特尔AlderLake、RaptorLakeCPU的LGA-1700封装尺寸相同。AMD最新的PhoenixAPU采用FP8封装方案,尺寸为25*40mm,这意味着StrixHalo的F

Cookie设置的常见问题及解决方案 Cookie设置的常见问题及解决方案 Jan 19, 2024 am 09:08 AM

Cookie设置的常见问题及解决方案,需要具体代码示例随着互联网的发展,Cookie作为一种最常见的常规技术,已经广泛应用于网站和应用程序中。Cookie,简单来说,是一种存储在用户计算机上的数据文件,可用于存储用户在网站上的信息,包括登录名、购物车内容、网站首选项等等。Cookie对于开发人员来说是一种必不可少的工具,但与此同时,Cookie设置常常会遇到

See all articles