Cookie 干货
从前端开发看Cookie
Cookie是浏览器端的存储机制
存在意义:
为了解决“如何记住用户信息”而发明的:
当用户访问网页时,他的名字可以存储在cookie中
下次用户访问该页面时,cookie会“记住”他的名字
特点:
会话Cookie:即不设置过期时间,此时只要关闭浏览器Cookie就会消失,注意是关闭浏览器而不是关闭一个标签
持久Cookie:即设置了过期时间(expires),此时关闭浏览器,如果没有超过设置的过期时间则Cookie还会存在,直到过期
谷歌浏览器不能设置本地文件Cookie,IE、火狐都可以
只要浏览器关闭Cookie功能,所有Cookie功能都不会实现
设置Cookie:
document.cookie = "name = tizi"
其中可以添加上 path,不设置则默认当前页,及在上级页面不可以获取到Cookie,但是在下级页面可以(做了几个实验,不知道是不是绝对的):
如在file:///D:/MySite/test.html 下设置了Cookie,在 file:///D:/MySite/src/test.html 下也可以获取,反之就不可以了
但是,如果设置了 path = / ,上面的反过来就可以了:
如在file:///D:/MySite/test.html 下设置了Cookie,在 file:///D:/MySite/src/test.html 下也可以获取,反之也可以了
获取Cookie:
console.log(document.cookie)
更改Cookie:
document.cookie = "name = tiziChange"
删除Cookie:
document.cookie = "name = ; expires = Thu, 01 Jan 1970 00:00:00 UTC"
<html>
<button onclick="setC()">设置Cookie</button>
<button onclick="setCDate()">获取Cookie过期时间</button>
<button onclick="getC()">获取Cookie</button>
<button onclick="changeC()">更改Cookie</button>
<button onclick="delC()">删除Cookie</button>
<script>
// 设置 Cookie
function setC(){
document.cookie = "name = tizi;"
}
// 例如设置 一个两天过期且 age = 20 的 cookie
function setCDate(){
var date = new Date()
date.setTime(date.getTime() + 2*24*60*60*1000)
document.cookie = "age = 20; expires = " + date.toUTCString()
}
// 获取 Cookie
function getC(){
console.log( document.cookie )
}
// 更改 Cookie
function changeC(){
document.cookie = "name = tiziChange;"
}
// 删除 Cookie, 要将 expires 设置成过去时间即可
function delC(){
document.cookie = "name = ; expires = Thu, 01 Jan 1970 00:00:00 UTC"
}
</script>
</html>
其实我参考的就是W3School,为了方便自己记忆,就写了一下,嘎嘎~
Cookie 干货的更多相关文章
- jquery插件的用法之cookie 插件
一.使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...
- Cookie的简单用法
ASP.NET初学者使用cookie的时候会感觉很陌生,在学习的过程中掌握cookie对象的增删改查非常有必要,,下面是我学习的时候经常用到的这些方法 写入和读取Cookie都需要用户Respone对 ...
- (2018干货系列一)最新Java学习路线整合
怎么学Java Java是一门面向对象编程语言,不仅吸收了C++语言的各种优点,还摒弃了C++里难以理解的多继承.指针等概念,因此Java语言具有功能强大和简单易用两个特征. 话不多说,直接上干货: ...
- (2018干货系列三)最新PHP学习路线整合
怎么学PHP PHP是一种通用开源脚本语言.语法吸收了C语言.Java和Perl的特点,利于学习,使用广泛,主要适用于Web开发领域. 菜鸟到大神,一步到位,正式开启干货模式: PHP初级开发工程师 ...
- Retrofit2.0 ,OkHttp3完美同步持久Cookie实现免登录(二)
原文出自csdn: http://blog.csdn.net/sk719887916/article/details/51700659: 通过对Retrofit2.0的<Retrofit 2.0 ...
- (2018干货系列二)最新HTML5学习路线整合
怎么学HTML5 HTML5是万维网的核心语言,标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改,一方面提升了用户体验,另一方面HTML5技术跨平台,适配多终端,改变了传统开发者 ...
- [干货,阅后进BAT不是梦]面试心得与总结---阿里、小米、腾讯
之前实习的时候就想着写一篇面经,后来忙就给忘了,现在找完工作了,也是该静下心总结一下走过的路程了,我全盘托出,奉上这篇诚意之作,希望能给未来找工作的人一点指引和总结, 也希望能使大家少走点弯路 , 如 ...
- 一文带你看懂cookie,面试前端不用愁
本文由云+社区发表 在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存储方式,而实际上,cookie本身并 ...
- Redis+Twemproxy+HAProxy集群(转) 干货
原文地址:Redis+Twemproxy+HAProxy集群 干货 Redis主从模式 Redis数据库与传统数据库属于并行关系,也就是说传统的关系型数据库保存的是结构化数据,而Redis保存的是一 ...
随机推荐
- Lambda表达式底层分析
一.我们先看下C#代码下Lamdba表达式的写法 // <summary> /// 写入日志委托 /// </summary> /// <param name=" ...
- STL 队列模板实现
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/u010016150/article/details/32715801 C++ Prime确实有点 ...
- nuxt 项目启动报错(HTMLElement is not define nuxt.js)
这两天研究服务端渲染,折腾nuxt,搞得真是心累. 各种报错,nuxt 真是坑多啊,且来说说遇到哪些问题, 1. 搭建nuxt , npx create-nuxt-app <项目名> cd ...
- visual studio 2013下搭建 安卓,ios,wp app开发平台
1.安装 visual studio 2013 + Microsoft Visual Studio 2013 Update 4+Microsoft Build Tools 2015 2.安装java ...
- Centos6.5升级安装openssh7.7p1
Centos6.5升级安装openssh7.7p1 关于OpenSSH漏洞 2016年1月14日OpenSSH发布官方公告称, OpenSSH Client 5.4~7.1 版本中未公开说明的功 ...
- 在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr。
在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr. $("#checkAll").prop("checked", true ...
- Keepalived+LVS+nginx搭建nginx高可用集群
1. 环境准备 1. VMware; 2. 4台CentOs7虚拟主机:192.168.122.248,192.168.122.68, 192.168.122.110, 192.168.122.167 ...
- Q:简单实现URL只能页面跳转,禁止直接访问
sessionStorage 用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据,且不同标签页的session不能共享,通过此特性来控制某个页面只能通过上级页面同标签页跳转 ...
- Web API 接口参考
Web API 接口参考:https://developer.mozilla.org/zh-CN/docs/Web/API
- csp-s模拟测试97
csp-s模拟测试97 猿型毕露.水题一眼秒,火题切不动,还是太菜了. $T1$看了一会儿感觉$woc$期望题$T1??$假的吧??. $T2$秒. $T3$什么玩意儿. 40 01:24:46 00 ...