浏览器之cookie,sessionStorage与localStorage
作为java后台开发人员,对于cookie的操作我们一般在服务器端使用response来操作, 但是,既然cookie\作为浏览器端会话技术, 那么js能不能操作cookie呢, 之前我一直想在浏览器端获取qq空间的cookie,看看大佬写的cookie包含哪些信息, 在查找大量资料后的处理结论,下面讲讲js怎么操作cookie
通过 JavaScript 创建 cookie
JavaScript 可以用 document.cookie 属性创建、读取、删除 cookie。
一.cookie
通过 JavaScript,可以这样创建 cookie:
document.cookie = "username=Bill Gates";
您还可以添加过期时间,告诉浏览器 cookie 属于什么路径。默认情况下,cookie 属于当前页。
document.cookie = "username=Bill Gates; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
注意:expires和path是关键字,不能乱改, expires(过期时间)手写容易出错, 你可以这样做:
//设置过期时间为一个月
var Days = 30*24*60*60*1000;
//新建时间
var expires= new Date();
//再修改时间延迟一个月
expires.setTime(expires.getTime() + Days);
document.cookie = name + "="+ escape (value) + ";expires=" + expires.toGMTString();
通过 JavaScript 读取 cookie
var x = document.cookie;
document.cookie 会在一条字符串中返回所有 cookie,比如:cookie1=value; cookie2=value;
cookie3=value; 要想获取指定cookie, 你可以通过spilt或者正则提取
通过 JavaScript 修改 cookie
document.cookie = "username=Steve Jobs; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
旧 cookie 被覆盖。
通过 JavaScript 删除 cookie
删除 cookie 时不必指定 cookie 值:
直接把 expires 参数设置为过去的日期即可:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
您应该定义 cookie 路径以确保删除正确的 cookie。
如果你不指定路径,一些浏览器不会让你删除 cookie。
原文请点击这里
二.sessionStorage和localStorage
sessionStorage和localStorage之所以放在一起是因为它两使用几乎一样(看别人文章说两者是在h5后才提供的)
那区别在哪呢?
sessionStorage将数据保存在session对象中,浏览器关闭内容就删除了,而localStorage将数据保存在浏览器缓存中,浏览器关闭数据仍然存在
既然两者操作相同,我就用sessionStorage举例:
保存数据语法:
sessionStorage.setItem("key", "value");
读取数据语法:
var lastname = sessionStorage.getItem("key");
删除指定键的数据语法:
sessionStorage.removeItem("key");
删除所有数据:
sessionStorage.clear();
最后再加一张图片: