博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浅谈JS-cookie,你是香甜可口的小点心吗?
阅读量:6611 次
发布时间:2019-06-24

本文共 1181 字,大约阅读时间需要 3 分钟。

引言:

想必大家一定听过或看过浏览器cookie,早在nokia雄霸天下、我们还不太明白浏览器的时候,cookie就已经悄悄地存在于浏览器的“设置选项”中了。当时它的用途仅仅是让你选择是否“清除”。年少的我很纳闷,这“甜点”(cookie在英语中的解释)是什么意思?

光阴如梭,直到接触到web开发才发现自己以前对cookie的理解是多么可笑,哈哈哈。。。

cookie在浏览器中是什么作用呢?果断找度娘,cookie用来存储网站或用户的数据、行为等信息。比如:用户设置网站的主题,网站将相关的数据记录存在cookie中;用户登录帐户后,点击“记住用户名”,可以使用cookie来记录;网站打开有个弹窗,其中有一个“不再提示”的选项,果断 get√,下次打开就不会出现这个弹窗。。。等等的小例子,大家明白其中的作用吧!

 

揭露秘密的时刻:

我们来看看你的浏览器下 baidu.com 的cookie吧!

聪明的少年们很快就能注意到,cookie是document下的一个方法。根据经验,document.cookie 可以读取浏览器的cookie值,是不也可以添加或设置cookie值呢?

(注意点:想在本地测试测试浏览器cookie,推荐使用firefox浏览器,其他浏览器可能没有效果。)

cookie的大小依据不同的浏览器而定,一般为4KB,而且服务器语言如PHP,Java等也能操作cookie。

 

给网站添加cookie:

1  2  3  4 
5 6 7 17 18

我们来看看浏览器下的变化吧!

当我们添加cookie是,语句中的 " = " 其实有两个含义:

  • 当cookie名称相同是,为覆盖的作用
  • 当cookie名称不同时,为添加操作

浏览器下出现了两条cookie记录,每条记录之间以 '; '分隔(记得分号后面必须要有空格)。在firebug展现的表格中有“过期时间”和“最长有效期”两项值得我们注意。

 

设置cookie的有效期:在添加浏览器cookie时,有这样的一个参数来设置cookie的有效期(也可以叫做过期时间):expires

代码走起:

1  2  3  4 
5 6 7 18 19

 

 上面的代码可以方便的实现本站点下cookie的创建、修改、删除的功能,那么我们如何获取具体的cookie值呢?

1  2  3  4 
5 6 7 8

9 42 43

简单分析:

我们使用 document.cookie.split("; "); 来分割获取的cookie记录,在 for 循环中二次切割每一条 cookie记录,这样的话我们就能够轻松地获取想要的啦!

转载于:https://www.cnblogs.com/dereksunok/p/3683309.html

你可能感兴趣的文章
运算符及优先级 表
查看>>
String类
查看>>
《编写可维护的JavaScript》——JavaScript编码规范(二)
查看>>
NSDateComponents
查看>>
Sparse low rank approximation
查看>>
在 Ubuntu 系统安装 Redi laravel 5.2 引入第三方类
查看>>
[C#]判断回文串;数组中最大最小值,平均值
查看>>
iOS中UIButton的titleEdgeInsets和imageEdgeInsets
查看>>
TestNG基本注解
查看>>
vue组件传值总结
查看>>
spring配置多个数据源
查看>>
tidb 架构 ~Tidb学习系列(1)
查看>>
saltstack系列~第一篇
查看>>
Jmeter java协议配置文件导入
查看>>
java中next和nextline的区别
查看>>
Linux中/etc/init.d
查看>>
eclipse中logcat偶尔不显示log的问题解决办法
查看>>
本周作业
查看>>
Linux下解决命令未找到的问题
查看>>
为什么要有预发布环境
查看>>