您当前的位置： 首页 > 学无止境 > JS经典实例 网站首页JS经典实例

javascript学习笔记-Cookie与存储(storage)

发布时间：2018-04-05 18:19:47编辑：雪饮阅读（）

 cookie的写入与获取

google需要在服务端才能生效

window.onload=function(){

   //写入cookie

   document.cookie='user=雪饮';

   //cookie获取

   alert(document.cookie);

}

cookie的写入(设置有效期)

var date=new Date();

   date.setDate(date.getDate()+7);

   document.cookie='user=雪饮'+';expires='+date;

   alert(document.cookie);

cookie的删除

一般的，有效期到了后cookie会自动失效，或者会话关闭也会删除。

var date=new Date(0);

   document.cookie='user=雪饮'+';expires='+date;

   alert(document.cookie);

cookie的创建(指定允许访问的路径)

var path="/C:/Users/Administrator/Zend/workspaces/DefaultWorkspace/js/WebContent/a/";

document.cookie='user=雪饮;path='+path;

alert(document.cookie);

cookie的域名限制

var domain = 'yc60.com';

document.cookie = "user= " + encodeURIComponent('李炎恢') + ";domain=" + domain;

如果定义了 yc60.com，那么在这个域名下的任何网页都可访问，如果定义了 v.yc60.com，那么只能在这个二级域名访问该 cookie，而主域名和其他子域名则不能访问。

 

设置域名，必须在当前域名绑定的服务器上设置，如果在 yc60.com 服务器上随意 设置其他域名，则会无法创建 cookie。

 

存储(ie支持)

存储需要一个容器，并且使用style语法

<div id="box" style="behavior:url(#default#userData)"></div>

存储的创建与读取

默认情况下，创建存储没有设置时间则代表存储永久有效

window.onload=function(){

   //创建存储

   var box=document.getElementById("box");

   box.setAttribute('name','雪饮');

   //保存存储，参数为存储对象名

   box.save('user');

  

   //读取存储

   box.load("user");

   var xy=box.getAttribute("name");

   alert(xy);

}

存储的创建与读取(设置有效期)

//创建存储

   var box=document.getElementById("box");

   box.setAttribute('name','雪饮');

   //注意这里date必须使用连贯操作，而不是一步一步的赋值覆盖

   var date=new Date();

   date.setDate(date.getDate()+7)

   var gmts=date.toGMTString();

   //注意这里接受的是最终toGMTString的值而不是date对象

   box.expires=gmts;

   box.save('user');

  

   //读取存储

   box.load("user");

   var xy=box.getAttribute("name");

   alert(xy);

存储的删除

由于存储是基于cookie的，在ie的“internet选项”=》“常规=>删除”中勾选cookie即可清除掉。

存储的删除(通过代码)

box.removeAttribute("name");

box.save('user');

web存储

JavaScript 提供了 sessionStorage 和 globalStorage。

在 HTML5 中提供了 localStorage 来取代 globalStorage。而浏览器最低版本为：IE8+、Firefox3.5+、Chrome 4+和 Opera10.5+。

sessionStorage的创建与读取

默认是关闭会话就会自动清除，如果在火狐59.0.1的32位中可以通过“隐私与安全”=》“网站数据”=》“清除所有数据”进行清除

sessionStorage.setItem('name','雪饮');

alert(sessionStorage.getItem('name'));

sessionStorage的删除

sessionStorage.removeItem("name");

alert(sessionStorage.getItem('name'));

sessionStorage以属性的形式创建与读取

//sessionStorage的创建、删除、读取

   sessionStorage.xy="杜敏捷";

   sessionStorage.removeItem("xy");

   alert(sessionStorage.xy);

localStorage与globalStorage

由于 localStorage 代替了 globalStorage，所以在 Firefox、Opera 和 Chrome 目前的最 新版本已不支持。

alert(localStorage);

alert(globalStorage);