请描述一下 cookies,sessionStorage 和 localStorage 的区别
原文:http://blog.csdn.net/lxcao/article/details/52809939
相同点:都存储在客户端
不同点:
1.存储大小
- cookie数据大小不能超过4k。
- sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
2.有效时间
- localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据;
- sessionStorage 数据在当前浏览器窗口关闭后自动删除。
- cookie 设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭
3. 数据与服务器之间的交互方式
- cookie的数据会自动的传递到服务器,服务器端也可以写cookie到客户端
- sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。
----------------------------------------------------------------------------------------------------------------------------------------
额外拓展【加分项】:Cookie的操作(有点小难度)防止面试官细问cookie的操作。
设置Cookie
cookie的几个要素
cookie的内容:采用 key=value;key=value……存储,参数名自定义
cookie的过期时间:使用参数expires
cookie的路径:使用参数path,"/"表示这个网站的页面,不推荐!容易产生冲突
注意:形如“/pro/index.html”路径,在google浏览器正常,在IE浏览器得不到值
cookie的表示方式示例
- var name = "jack";
- var pwd = "123";
- var now = new Date();
- now.setTime(now.getTime() +1 * 24 * 60 * 60 * 1000);//转毫秒
- var path = "/";//可以是具体的网页
- document.cookie = "name=" + name + ";expires=" + now.toUTCString() + ";path=" + path;//姓名
- document.cookie= "pwd=" + pwd + ";expires=" + now.toUTCString()+ ";path=" + path; //密码
读取cookie
获取cookie内容
- vardata=document.cookie;//获取对应页面的cookie
解析cookie
方式1:截取字符串
- function getKey(key) {
- var data = document.cookie;
- var findStr = key + "=";
- //找到key的位置
- var index = data.indexOf(findStr);
- if (index == -1)
- return null;
- var subStr = data.substring(index +findStr.length);
- var lastIndex = subStr.indexOf(";");
- if (lastIndex == -1) {
- return subStr;
- } else {
- return subStr.substring(0,lastIndex);
- }
- }
方式2:使用正则表达式+JSON
- function getKey(key) {
- return JSON.parse("{\"" +document.cookie.replace(/;\s+/gim, "\",\"").replace(/=/gim, "\":\"") + "\"}")[key];
- }
清除cookie
- var name = null;
- var pwd = null;
- var now = new Date();
- var path = "/";//可以是具体的网页
- document.cookie= "name=" + name + ";expires=" + now.toUTCString()+ ";path=" + path;//姓名
- document.cookie = "pwd=" + pwd + ";expires=" + now.toUTCString()+ ";path=" + path; //密码
请描述一下 cookies,sessionStorage 和 localStorage 的区别的更多相关文章
- 关于cookies,sessionStorage和localStorage的区别
如果我说得啰嗦了,请麻烦提醒我一下~~ 面试的时候说: 首先这三个可以在浏览器端按下F12,在Application可以查看到. 如下图: cookies: sessionStorage: sessi ...
- 前端面试01:描述一下cookices sessionStorage 和 localStorage 的区别
相同点:都可以存储在客户端 不同点: 1.存储大小 cookie数据大小不能超过4K. sessionStorage 和 localStorage 虽然也有大小限制,但是比cookie大得多,可以达到 ...
- cookies,sessionStorage和localStorage的区别
联系: sessionStorage和localStorage一样,都是用来缓存客户端缓存信息. 他们都只能存储字符串类型对象. 区别: localStorage的生命周期是永久的,除非用户主动清除浏 ...
- 7,请描述下cookies,sessionStorage和localStorage的区别
7,请描述下cookies,sessionStorage和localStorage的区别 首先,cookie是网站为了标识用户身份而储存在用户本地终端(client side,百科: 本地终端指与计算 ...
- cookies,sessionStorage 和 localStorage 的区别
请描述一下 cookies,sessionStorage 和 localStorage 的区别? sessionStorage 和 localStorage 是HTML5 Web Storage AP ...
- cookies、sessionStorage和localStorage的区别
cookies.sessionStorage和localStorage的区别 对比 特性 Cookie LocalStorage SessionStorage 数据的生命周期 ...
- 请描述一下 cookies,sessionStorage和localStorage的区别?
cookie在浏览器和服务器间来回传递. sessionStorage和localStorage不会sessionStorage和localStorage的存储空间更大:sessionStorage和 ...
- 请描述一下cookies、sessionStorage、localStorage、session四者的区别?
存储大小: cookie在4K以内. sessionStorage和localStorage在5M以内. 有效时间: cookie:如果未设置过期时间,关闭浏览器时清空:如果设置了有效时间则在到期后清 ...
- 描述一下 cookies,sessionStorage 和 localStorage 的区别
cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密),数据会在浏览器和服务器间来回传递.sessionStorage和localStorage不会自 ...
随机推荐
- c++踩坑大法好 数组
1,c++遍历数组 int数组和char数组不同哦,int占4位,char占1未,同理double也不同.基本遍历方法: ] = { ,,, }; ]); printf("len of my ...
- JS高级---创建正则表达式对象
创建正则表达式对象 两种: 1.通过构造函数创建对象 2.字面量的方式创建对象 正则表达式的作用: 匹配字符串的 //对象创建完毕--- var reg = new RegExp(/\d{5} ...
- Appnium 环境搭建
NodeJs 下载安装 npm install -g appium-doctor Java JDK jdk-8u241-windows-x64 添加环境变量:JAVA_HOME 在环境变量Path中添 ...
- linq和扩展方法
c#的扩展方法 1.必须是在一个非嵌套.非泛型的静态类中的静态方法 2.至少一个参数,第一个参数附加this,不能有其他修饰符如out.ref 3.第一个参数不能是指针类型 上面例子是自定义的一个扩展 ...
- 修改oracle数据库用户名和密码
第一步:连接数据库 使用ssh工具以root身份连接服务器, 然后切换到oracle用户:su - oracle(回车) 使用sqlplus连接数据库:sqlplus /nolog(回车) 以管理员身 ...
- MySql 中关键字 case when then else end 的用法
解释: SELECT case -------------如果 ' then '男' -------------sex='1',则返回值'男' ' then '女' -------------sex= ...
- LitElement(六)生命周期
1.概述 基于LitElement的组件通过响应观察到的属性更改而异步更新. 属性更改是分批进行的,如果在请求更新后,更新开始之前,发生更多属性更改,则所有更改都将捕获在同一次更新中. 在较高级别上, ...
- NEON的vsub方法溢出
关于NEON的vsub方法的溢出,结果如下: vsub会产生溢出,根据数据bit表示规律,可知溢出结果和理论正确结果形成互补,比如249-(-7)=256 使用类vreinterpretq_s16_u ...
- Thymeleaf th:include,th:replace使用
来自:https://blog.csdn.net/believe__sss/article/details/79992408
- 数据存储 csv
# # 保存csv格式的数据import csv csvFile = open('test.csv','w+',newline='') #文本方式可读写 try: writer = csv.write ...