js cookie创建读取删除函数封装

一、总结

都是为了方便操作，这样弄了很方便

1、创建cookie的函数封装的作用：方便设置过期时间expire，方便设置键和值

2、查询cookie的数据封装的作用：document.cookie 获取的cookie是这样的：name1=aaa; name2=bbb; name3=ccc; 所以需要用split函数分割，先用:分割，然后用=等号分割

3、删除cookie的函数封装的作用：设置过期时间是位过去时间

二、js cookie创建读取删除函数封装

封装cookie创建/读取/删除的函数

  • 创建cookie数据的函数封装
  • 读取cookie数据的函数封装

    split() 方法用于把一个字符串分割成字符串数组。

  • 删除cookie的函数封装

三、代码

4-4 创建

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

   /*

   //普通方法创建cookie，如果多条的话比较繁琐

    document.cookie='name=jiyanpeng';

    document.cookie='qq=365966179';

    document.cookie='email=365966179@qq.com';

   //封装创建cookie的函数1

   function setCookie(key,value,expires){

       var ddate=new Date();

           ddate.setDate(ddate.getDate()+expires)

       document.cookie=key+'='+value+';expires='+ddate;

       alert(document.cookie)

   }

   setCookie('name1','jiyanpeng1',10);

   setCookie('name3','jiyanpeng3')

 */

   //封装创建cookie的函数2

   function setCookie(key,value,expires){

       document.cookie=key+'='+value+';expires='+ddate(expires);

   }

       function ddate(expires){

       var ddate=new Date()

         ddate.setDate(ddate.getDate()+expires)

         return ddate

     }

     setCookie('name4','jiyanpeng4',30);

     //alert(ddate(7))

   </script>

 </body>

 </html>

4-5 查询

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

   /*

   //封装创建cookie的函数2

   function setCookie(key,value,expires){

     document.cookie=encodeURIComponent(key)+'='+encodeURIComponent(value)+';expires='+ddate(expires); //1、encodeURIComponent对中文进行编码

   }

     function ddate(expires){

       var ddate=new Date()

         ddate.setDate(ddate.getDate()+expires)

         return ddate

     }

     setCookie('name','吉延鹏')

     setCookie('qq','365966179')

     setCookie('email','365966179@qq.com')

     //alert(document.cookie)

     //split() 方法用于把一个字符串分割成字符串数组。

     var str='name1=aaa;name2=bbb;name3=ccc;';

     var arrStr=str.split(';')

     //alert(arrStr);

     //alert(arrStr[0]); //name1=aaa

     var arr=arrStr[0].split('=')

     //alert(arr[0]+'\n'+arr[1])

 */

     //读取cookie

     function getCookie(name){

       var arrStr=document.cookie.split(';');

       //alert(arrStr)

       for(var i=0;i<arrStr.length;i++){

         var arr=arrStr[i].split('=')

         //alert(arr[0]+'\n'+arr[1])

         if(arr[0]==name){return arr[1] }

       }

      return ''

     }

    alert(getCookie('email'))

   </script>

 </body>

 </html>

4-6 删除

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

   //封装创建cookie的函数2

   function setCookie(key,value,expires){

     document.cookie=encodeURIComponent(key)+'='+encodeURIComponent(value)+';expires='+ddate(expires);

   }

     function ddate(expires){

       var ddate=new Date()

         ddate.setDate(ddate.getDate()+expires)

         return ddate

     }

     setCookie('name','吉延鹏')

     setCookie('qq','365966179')

     setCookie('email','365966179@qq.com')

     //读取cookie

     function getCookie(name){

       var arrStr=document.cookie.split('; ');

       //alert(arrStr)

       for(var i=0;i<arrStr.length;i++){

         var arr=arrStr[i].split('=')

         //alert(arr[0]+'\n'+arr[1])

         if(arr[0]==name){return decodeURIComponent(arr[1]) } //2、decodeURIComponent解码

       }

      return ''

     }

     function setCookie(key,value,expires){

       var ddate=new Date();

         ddate.setDate(ddate.getDate()+expires)

       document.cookie=key+'='+value+';expires='+ddate;

     }

     function removeCookie(name){

         setCookie(name,'随意值',-1)

     }

    alert(document.cookie)

    removeCookie('name')

    alert(document.cookie)

    removeCookie('qq')

     alert(document.cookie)

    // alert(getCookie('name'))

    // alert(getCookie('email'))

    // alert(getCookie('qq'))

   </script>

 </body>

 </html>

js cookie创建读取删除函数封装的更多相关文章

  1. js动态创建表格,删除行列的小例子

    js动态创建表格,删除行列的实例代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  2. jQuery 操作Cookie 存储 读取 删除等

    <script type="text/javascript" src="/UI.Web.CRM.Main/js/jquery-2.1.1.min.js"& ...

  3. cookie创建，删除

    Cookie 历来指就着牛奶一起吃的点心.然而,在因特网内,“Cookie”这个字有了完全不同的意思.那么“Cookie”到底是什么呢?“Cookie”是小量信息,由网络服务器发送出来以存储在网络浏览 ...

  4. PHP中的cookie创建取回删除；

    <?php $expire=time()+3600;//设置过期cookie时间 setcookie('yaoyuan',"webyaoyuan",$expire);//se ...

  5. Node.js：创建应用+回调函数（阻塞/非阻塞）+事件循环

    一.创建应用 如果我们使用PHP来编写后端的代码时,需要Apache 或者 Nginx 的HTTP 服务器,并配上 mod_php5 模块和php-cgi.从这个角度看,整个"接收 HTTP ...

  6. 创建/读取/删除Session对象

    //创建Session对象 Session["userName"] = "顾德博";//保存,这里可以存储任意类型的数据,包括对象.集合等 Session.Ti ...

  7. JS cookie 设置 查看 删除

    JScookie 常用的3个预设函数(库) <!DOCTYPE HTML> <html> <head> <meta charset="utf-8&q ...

  8. js动态创建和删除option

    1.动态创建select function createSelect(){           var mySelect = document.createElement("select&q ...

  9. 通过JS动态创建和删除HTML元素

    <script type="text/javascript" language="Javascript"> function InputOnBlur ...

随机推荐

  1. BZOJ4712: 洪水(树链剖分维护Dp)

    Description 小A走到一个山脚下,准备给自己造一个小屋.这时候,小A的朋友(op,又叫管理员)打开了创造模式,然后飞到 山顶放了格水.于是小A面前出现了一个瀑布.作为平民的小A只好老实巴交地 ...

  2. ZJOI2008骑士

    Z国的骑士团是一个很有势力的组织,帮会中汇聚了来自各地的精英.他们劫富济贫,惩恶扬善,受到社会各界的赞扬. 最近发生了一件可怕的事情,邪恶的Y国发动了一场针对Z国的侵略战争.战火绵延五百里,在和平环境 ...

  3. mktemp---创建暂存文件

  4. .Net 程序在自定义位置查找托管/非托管 dll 的几种方法

    原文:.Net 程序在自定义位置查找托管/非托管 dll 的几种方法 一.自定义托管 dll 程序集的查找位置 目前(.Net4.7)能用的有2种: #define DEFAULT_IMPLEMENT ...

  5. zookeeper提供了什么

    简单的说,zookeeper=文件系统+通知机制. 每个子目录项如 NameService 都被称作为 znode,和文件系统一样,我们能够自由的增加.删除znode,在一个znode下增加.删除子z ...

  6. HDU 5063 Operation the Sequence（暴力 数学）

    题目链接:pid=5063" target="_blank">http://acm.hdu.edu.cn/showproblem.php?pid=5063 Prob ...

  7. android关键组件service服务(一)

    一. Service简单介绍 Service是android 系统中的四大组件之中的一个(Activity.Service.BroadcastReceiver.ContentProvider),它跟A ...

  8. opencv中的Java库

    opencv中有一个用Java编写的库,opencv2.4.4以上,在opencv解压包里路径:opencv/build/java/opencv.jar,再依据用户计算机位数选择,假设是32位计算机, ...

  9. 旧知识打造新技术--AJAX学习总结

    AJAX是将旧知识在新思想的容器内进行碰撞产生的新技术:推翻传统网页的设计技术,改善用户体验的技术. 学习AJAX之初写过一篇<与Ajax的初次谋面>.当中都仅仅是一些自己浅显的理解.这次 ...

  10. worktools-mmx 添加编译模块

    1,添加模块到mmx.py文件 1>vim /home/zhangshuli/git/vanzo_team/xulei/mmx.py 2>按照格式"Gallery2": ...