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. 项目: 基于Python socket模块实现的简单 ftp 项目:

    需要 自己创建一个 info 文件 用来存储用户信息 服务器: import socket import pickle import struct import os import time ''.s ...

  2. POJ 2111 DP+记录路径

    题意: 思路: 类似滑雪 //By SiriusRen #include <cstdio> #include <cstring> #include <algorithm& ...

  3. java(数组及常用简单算法 )

    数组 数组:数组是存储同一种数据类型数据的集合容器. 数组的定义格式: 数据类型[]  变量名  =  new  数据类型[长度]; 数组的好处:对分配到数组对象中每一个数据都分配一个编号(索引值.角 ...

  4. cf1089d Distance Sum

    题目大意 给一个有n个点,m条边的无向连通图,求所有点两两之间的最短路.$(2<=n<=10^5;n-1<=m<=n+42)$ solution 我们注意到$m-n+1$很小. ...

  5. Web开发中,使用表格来展示每个角色对应的权限

    通过表格这种方式,来展示角色和权限之间的关系,挺好的.还有很多场景,都可以用这种方式. 角色权限表 权限 系统管理员 文章管理员 相册管理员 留言管理员 个人信息管理 查看个人信息 √ √ √ √ 编 ...

  6. linux6.0系统如何安装portmap

    因为在6.0的系统里,portmap已经改名了.在Redhat或CentOS5中可以使用 service portmap start启动服务,然后在启动nfs服务,实现挂载. 6里面可是试试 serv ...

  7. POJ——T 3461 Oulipo

    http://poj.org/problem?id=3461 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 42698   ...

  8. ANSI-X99MAC算法和PBOC的3DES MAC算法

    仅仅要有标准的DES加密和解密算法.类似ANSI-X99MAC算法和PBOC3DES算法就非常好实现.他们都是用DES算法再经过一层算法实现的.实现原理看图就能看明确.3DES算法实现就更简单了.就是 ...

  9. hdu 1003 Max Sum 最大字段和 dp

    今天看了一上午dp.看不太懂啊.dp确实不简单.今天開始学习dp,搜了杭电的dp46道,慢慢来吧.白书上的写的 又不太具体,先写几道题目再说. .. 题目连接:id=516&page=1&qu ...

  10. css笔记（二）——几种经常使用的模式

    文本垂直居中 对于行内元素,height会自己主动收缩到包裹住文本的高度,所以不存在这个问题. 可是对于block和inline-block等盒子元素.假设设置了height属性,则文本默认会在上方显 ...