<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Document</title>

</head>

<body>

  用户名：<input type="text" name="user" id="user">

  年龄：<input type="text" name="age" id="age">

  <input type="button" name="" value="提交" id="btn">

</body>

</html>

　　

JS代码

<script type="text/javascript">

  // 设置cookie

  function setCookie(){

    // 获取当前时间

    var date = new Date();

    // 支持传一个json {name:value}

    var a = arguments;

    if(a.length==2){

      // 设置过期时间 = 当前时间 + 过期时间；

      date.setDate(date.getDate()+a[1]);

      for(k in a[0]){

        document.cookie = k +"="+ encodeURI(a[0][k]) +";expires=" + date.toGMTString()+";path=/";

      }

    }else{

      date.setDate(date.getDate()+a[2]);

      // 设置cookie = 值=value  encodeURI(把值进行编码) expires设置过期时间 path设置网站目录访问cookie权限，/表示当前域名下的所有目录都可以访问这个cookie

      document.cookie = a[0] +"="+ encodeURI(a[1]) +";expires=" + date.toGMTString()+";path=/";

    }

  }

  // 读取cookie

  function readCookie(name){

    // 获取cookie decodeURI把cookie进行解码

    var cookie = decodeURI(document.cookie);

    // 获取当前名称的起始索引

    var start = cookie.indexOf(name+'=');

    // 如果找不到这个名称的话就直接返回；

    if(start==-1)return '';

    // 获取结束索引，start表示开始查找的起点

    var end = cookie.indexOf(';',start);

    // 如果返回-1说明是最后一条数据

    if(end==-1){

      // 最后一条直接截取到末尾

      return cookie.substring(start+name.length+1);

    }

    // 如果不是末尾的话截取到;

    return cookie.substring(start+name.length+1,end);

  }

  // 删除cookie

  function removeCookie(name){

    document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/";

  }

  // 写入cookie

  var oBtn = document.getElementById('btn');

  oBtn.onclick = function(){

    var user = document.getElementById('user').value;

    var age = document.getElementById('age').value;

    // 设置cookie

    setCookie({

      'user':user,

      'age':age

    },10);

  };

  // 打印cookie

  console.log(readCookie('user'));

</script>

　　

使用方法：

　　设置cookie：setCookie()支持传递2个或3个参数 json&&time || nam&&value&&time              json:{name:value},time:多久过期

　　读取cookie：readCookie(要读取的cookie名称)

　　删除cookie：removeCookie(要删除的cookie名称)

　　

以上也是闲来无事写的，仅供参考，如果有不懂的可以在下方留言，如果多人需要帮助的话我再另外开一片文章专门讲。

javscript对cookie的操作，以及封装的更多相关文章

  1. java对cookie的操作

    java对cookie的操作比较简单,主要介绍下建立cookie和读取cookie,以及如何设定cookie的生命周期和cookie的路径问题. 建立一个无生命周期的cookie,即随着浏览器的关闭即 ...

  2. Asp.Net Core 2.0 项目实战（4）ADO.NET操作数据库封装、 EF Core操作及实例

    Asp.Net Core 2.0 项目实战(1) NCMVC开源下载了 Asp.Net Core 2.0 项目实战(2)NCMVC一个基于Net Core2.0搭建的角色权限管理开发框架 Asp.Ne ...

  3. 原生js--cookie操作的封装

    封装cookie的操作:查询cookie个数.查询所有cookie的键.获取cookie.设置cookie.删除cookie.清除全部cookie /** * cookieStorage */func ...

  4. js 第四章 cookie的操作

    js 第四章 cookie的操作 一.学习要点 掌握cookie的简单应用 二. js 第四章 cookie的操作 了解cookie 什么是cookie? cookie 是存储于访问者的计算机中的变量 ...

  5. jquery.cookie.js 操作cookie实现记住密码功能的实现代码

    jquery.cookie.js操作cookie实现记住密码功能,很简单很强大,喜欢的朋友可以参考下.   复制代码代码如下: //初始化页面时验证是否记住了密码 $(document).ready( ...

  6. Jquery对Cookie的操作

    第一步:先引用jQuery的插件jquery-1.9.1.min.js 第二步:引用jquery.cookie.js插件 下对cookie的操作: $.cookie("cookieName& ...

  7. PHP中对数据库操作的封装

    在动态网面设计中很多都要涉及到对数据库的操作,但是有时跟据需要而改用其它后台数据库,就需要大量修改程序.这是一件枯燥.费时而且容易出错的功作.其实我们可以用PHP中的类来实现对数据库操作的封装,从而使 ...

  8. c#读写共享内存操作函数封装

    原文 c#读写共享内存操作函数封装 c#共享内存操作相对c++共享内存操作来说原理是一样,但是c#会显得有点复杂. 现把昨天封装的读写共享内存封装的函数记录下来,一方面希望给需要这块的有点帮助,另一方 ...

  9. C# .NET更智能的数据库操作的封装

    前述: 对数据库操作的封装,相信网络上已经有一大堆,ORM框架,或者是.NET本身的EF,都很好的支持数据库操作.这篇文章是分享自己所思考的,对数据库操作的简单封装.我对于这篇文章,认为被浏览者所关注 ...

随机推荐

  1. oracle 读书笔记

    1 动态sql即拼接字符串的sql,使用变量代替具体值,10万条语句可以被hash陈一个SQL_ID,可以只解析一次 for i in 1..100000 loop execute immediate ...

  2. [Java基础]代码块及java反编译

    块的作用域:   块(即复合语句)是指一对花括号括起来的若干条简单的java语句.块确定了变量的作用域.一个块可以嵌套在另一个块中.但是,在嵌套的两个块中声明同名的变量时应注意,块中变量申明在块外变量 ...

  3. codeforces 484E

    题意:给定n<=105的数组h,有m<=105的询问,每个询问为l,r,w求[l,r]区间内连续w个的最小高度最大是多少.. 思路:首先把h数组从大到小排序,然后用建立一个可持久化的下标线 ...

  4. 对文本行进行排序，新增-d（目录排序），只对字母数字空格排序（TCPL 练习5-16）

    文本行的排序用到了命令行参数以及多级指针,在要求只对字母数字空格进行排序时,关键的问题点是兼容-f命令参数,也就是排序的同时忽略大小写.由于在之前的练习中,我将忽略大小写的比较方法重新写了一个函数tr ...

  5. 中国大学MOOC-陈越、何钦铭-数据结构-2016秋期末考试

    判断题: 1-1 N2logN和NlogN2具有相同的增长速度. (2分) 1-2 对一棵平衡二叉树,所有非叶结点的平衡因子都是0,当且仅当该树是完全二叉树.(2分) 1-3 无向连通图所有顶点的度之 ...

  6. springrain 1.1 发布，spring 的极简封装

    经过2个月的测试修改,springrain1.1已经稳定,今日发布. 主要改动如下: 1.添加批量更新和保存的方法 2.添加maven分支 3.添加博客管理的demo 4.增加redis做为缓存实现 ...

  7. 我的ORM之四--删除

    我的ORM索引 删除语法 var 影响行数 = dbr.表.Delete(条件).Execute(); 问题 1.如果没有Where条件,同样会报错.

  8. MySQL7：视图

    什么是视图 数据库中的视图是一个虚拟表.视图是从一个或者多个表中导出的表,视图的行为与表非常相似,在视图中用户可以使用SELECT语句查询数据,以及使用INSERT.UPDATE和DELETE修改记录 ...

  9. Hadoop日记Day12---MapReduce学习

    一.MapReduce简介 1.1MapReduce概述 MapReduce是一种分布式计算模型,由Google提出,主要用于搜索领域,解决海量数据的计算问题.MR由两个阶段组成:Map和Reduce ...

  10. nim的引用和指针

    nim语言的引用和其他语言的指针有点相似 可以提供一种“多对一”的关系 这就意味着不同的引用可以指向同一个内存位置 nim区分可被追踪的引用和不可被追踪的引用 不可被追踪的引用又称为指针 可被追踪的引 ...