网络系列之 cookie增删改查(封装)
什么是cookie 呢？简单来说，这个小东西，会记录你的 浏览器 浏览习惯，或 账号密码等， 以便于提高用户的体验感。
举个例子：
你们有没有发现，去淘宝一些购物网站， 你搜索了 椅子， 挑选了一会椅子，然后把页面关了， 等下再打开淘宝的时候， 淘宝会自动帮你推荐一些椅子 出来。这就是淘宝这个网页，利用cookie记录了你的需要，以便于下次，你再使用的时候，可以更方便。
还有qq邮箱登录，只要在QQ邮箱登录过， 你下次再去打开这个网页，你会发现，你的QQ账号，已经自动帮你填好了。
那么，接下来，我们来看cookie 怎么获取。
document.cookie 获取出来的 数据 为字符串形式。
domain 是 域，因为本次测试在 本地的服务器下进行， 所以是localhost
path 是路径
max-age 是存储cookie 的时间， 如果为 Session(临时存储，关闭页面即消失)， 显示的时间是 格林威治的时间
获取刚才设置的cookie
可以看到， 我们获取到的cookie 除了name 和 value 没有其他值的。
删除的话，cookie的时间过去，就会自动删除， 那么我们想要删除的话，就让他的时间变成 -1 即可。
现在来封装一下，cookie的 增删改查
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head> <body>
<script>
var manageCookie = {
setCookie: function (name, value, time) { //设置cookie 可以传入三个值， name value 和 时间
document.cookie = name + '=' + value + ';max-age=' + time;
return this; //这里返回 this， 是为了可以链式调用。
},
getCookie: function (name, cb) { //cb 是回调函数。
var temp = document.cookie.split('; '); //由于我们获取出来的 cookie 是 name=value; name=value 的字符串，所以拆分它。
for (var i = 0; i < temp.length; i++) {
var arr = temp[i].split('='); //按照 ; 拆完后,成 [name=value] [name=value] 那么我们循环 继续按照 = 拆
if (arr[0] == name) { //此时我们就可以拿到 name 值进行判断， 如果跟形参一样，说明要获取的 值就是他
cb(arr[1]); //那么我们执行 cb回调函数， 把 value 传回去即可
return this; //return this， 停止继续循环
}
}
cb(undefined); //如果找不到，我们传undefined 回去即可
return this;
},
removeCookie: function (name) {
this.setCookie(name, '', -1); // 删除的话，调用我们上面设置cookie的 函数， 把时间改成 -1 即可
return this;
}
}
</script>
</body> </html>
使用一下
网络系列之 cookie增删改查(封装)的更多相关文章
- Python pymysql 增删改查封装
关于pymysql 的增删改查,简单做个封装,方便后面使用直接拿来调用即可. 其中 增删改 的处理其实是一致的,本可以使用统一的方法,但是为了明显区分,这里分开来写了. 直接看代码就即可,如下: # ...
- PDO 增删改查封装的类
Selecting Data 你在mysql_*中是这样做的 <?php $result = mysql_query('SELECT * from table') or die(mysql_er ...
- spring学习（四）spring的jdbcTemplate（增删改查封装）
Spring的jdbcTemplate操作 1.Spring框架一站式框架 (1)针对javaee三层,每一层都有解决技术 (2)到dao 层,使用 jdbcTemplate 2.Spring对不同的 ...
- C# 数据操作系列 - 15 SqlSugar 增删改查详解
0. 前言 继上一篇,以及上上篇,我们对SqlSugar有了一个大概的认识,但是这并不完美,因为那些都是理论知识,无法描述我们工程开发中实际情况.而这一篇,将带领小伙伴们一起试着写一个能在工程中使用的 ...
- 微软Connect教程系列--自动生成增删改查页面工具介绍（二）
本章课程描述了vs2015的三个特点,其中主要将描述在vs2015下面,使用命令自动生成增删改查界面,具体如下: 1.web.config文件不在存在,用config.json替代,以适应支撑vs的插 ...
- python 10min系列之实现增删改查系统
woniu-cmdb 奇技淫巧--写配置文件生成增删改查系统 视频教程 项目主页跪求github给个star, 线上demo,此页面都是一个配置文件自动生成的 详细的文章介绍和实现原理分析会发布在我的 ...
- .Net程序员学用Oracle系列(12)：增删改查
1.插入语句 1.1.INSERT 1.2.INSERT ALL 2.删除语句 2.1.DELETE 2.2.TRUNCATE 3.更新语句 3.1.UPDATE 3.2.带子查询的 UPDATE 3 ...
- python之MySQL学习——简单的增删改查封装
1.增删改查封装类MysqlHelper.py import pymysql as ps class MysqlHelper: def __init__(self, host, user, passw ...
- sql增删改查封装
App.config文件 <?xml version="1.0" encoding="utf-8" ?> <configuration> ...
随机推荐
- ng中的ng-content ng-template ng-container
在angular中,有这样三个自带的标签,但是在angular的文档中没有说明,只有在api中有简单的描述,摸索了半天才搞懂是咋回事. ng-content <div> <ng-co ...
- 几道php反序列化题目
[极客大挑战 2019]PHP 提示源码泄漏,来用扫描器扫一下 扫出来www.zip,然后下载下来 有五个文件,代码审计一下 这个地方有一个可以反序列化的点,找到类 逻辑很简单,username=ad ...
- windows下nginx中配置端口转发 ----本文来自转载
什么是端口转发 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 转载原文链接:https://www.cnblogs.com/chanshuyi/ ...
- 4G DTU模块的工作原理
DTU是无线数据传输模块,4G DTU又被称4G模块,是4G网络进行远距离传输的设备,即串口服务器的无线版,其功能与串口服务器类似. 4G DTU是一种物联网无线数据终端,利用公用运营 ...
- python实现经典的排序算法
排序 关注公众号"轻松学编程"了解更多. 1.冒泡排序 基本思想:比较相邻的元素大小,将小的前移,大的后移,就像水中的气泡一样,最小的元素经过几次移动,会最终浮到水面上.原地排序, ...
- [CF160D]Edges in MST (最小生成树+LCA+差分)
待填坑 Code //CF160D Edges in MST //Apr,4th,2018 //树上差分+LCA+MST #include<cstdio> #include<iost ...
- 题解 P1541 【乌龟棋】
题目描述 乌龟棋的棋盘是一行\(N\)个格子,每个格子上一个分数(非负整数).棋盘第\(1\)格是唯一的起点,第\(N\)格是终点,游戏要求玩家控制一个乌龟棋子从起点出发走到终点. 乌龟棋中\(M\) ...
- ATcoder Grand Contest总结
最前面: AT的题都很有思维难度,总结一下一些AT的常规操作 1.对于有操作的题目,如果正面推不行的话考虑倒推,将操作转化,寻找更好的性质 2.模型转化,看到某一种的计算的式子,需要考虑有没有更简化的 ...
- ARM的三级流水线结构
看到汇编中很多关于程序返回与中断返回时处理地址都很特别,仔细想想原来是流水线作用的效果.所以,决定总结学习下ARM流水线. ARM7处理器采用3级流水线来增加处理器指令流的速度,能提供0.9MIPS/ ...
- CC模型加载太慢？一招破解！
伴随无人机性能的提升,单个项目涉及到的倾斜摄影数据范围不断扩大,模型的数据量越来越大,在同配置机器上的显示速度也相应的越来越慢,那么如何在不升级配置的情况下提升模型的加载速度呢? 01 百GB倾斜摄影 ...