web存储,一个比cookie更好的本地存储方式

localStorage和sessionStorage
localStorage-没有时间限制的数据存储
sessionStorage-针对一个session的数据存储
立即学习“前端免费学习笔记(深入)”;
//是否支持if(typeof(Storage)!=="undefined")
{// 是的! 支持 localStorage sessionStorage 对象!// 一些代码.....} else {// 抱歉! 不支持 web 存储。}localStorage对象
localStorage对象存储的数据没有时间限制
localStorage.sitename="小南瓜";
document.getElementById("result").innerHTML="网站名:" + localStorage.sitename;不管是 localStorage,还是 sessionStorage,可使用的API都相同,常用的有如下几个(以localStorage为例):
保存数据:localStorage.setItem(key,value); 读取数据:localStorage.getItem(key); 删除单个数据:localStorage.removeItem(key); 删除所有数据:localStorage.clear(); 得到某个索引的key:localStorage.key(index);
提示:键/值对通常以字符串存储,你可以按自己的需要转换该格式。
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML=" 你已经点击了按钮 " + localStorage.clickcount + " 次 ";
}
else
{
document.getElementById("result").innerHTML="对不起,您的浏览器不支持 web 存储。";
}sessionStorage对象
sessionStorage针对一个session进行数据存储。当用户关闭浏览器窗口后,数据会被删除
NetShop软件特点介绍: 1、使用ASP.Net(c#)2.0、多层结构开发 2、前台设计不采用任何.NET内置控件读取数据,完全标签化模板处理,加快读取速度3、安全的数据添加删除读取操作,利用存储过程模式彻底防制SQL注入式攻击4、前台架构DIV+CSS兼容IE6,IE7,FF等,有利于搜索引挚收录5、后台内置强大的功能,整合多家网店系统的功能,加以优化。6、支持三种类型的数据库:Acces
if(typeof(Storage)!=="undefined")
{
if (sessionStorage.clickcount)
{
sessionStorage.clickcount=Number(sessionStorage.clickcount)+1;
}
else
{
sessionStorage.clickcount=1;
}
document.getElementById("result").innerHTML="在这个会话中你已经点击了该按钮 " + sessionStorage.clickcount + " 次 ";
}
else
{
document.getElementById("result").innerHTML="抱歉,您的浏览器不支持 web 存储";
}简单的网站列表程序
运行结果:

JSON.stringify
存储对象数据,将对象转换为字符串
var site = new Object; ...var str = JSON.stringify(site); // 将对象转换为字符串
JSON.parse
将字符串转换为JSON对象
上面是JSON.stringify转换的结果
下面是JSON.parse转换结果











