部分转自 http://blog.csdn.net/oo191416903/article/details/64122379

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>H5'storage</title>
</head>
<body>
<input type='button' onclick='setItems()' value='set'/>
<input type='button' onclick='getItems()' value='get'/>
<input type='button' onclick='deleteItem()' value='delete'/>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script>
//localStorage存值永久有效
function setItems(){
var user = {};
user.name = 'Adam Li';
user.age = 25;
user.home = 'China';
//传数组 /*
    var testArray=new Array("Saab","Volvo","BMW");
    user = testArray;
*/
localStorage.setItem('userinfo',JSON.stringify(user));
}
//localStorage取值
function getItems(){
var data = JSON.parse(localStorage.getItem('userinfo'));
console.log("name:"+data.name+'\r age:'+data.age+"\r home:"+data.home);
//取数组 /* console.log("data:"+data);*/
} //localStorage删除指定键对应的值
function deleteItem(){
window.localStorage.removeItem('userinfo');
console.log(localStorage.getItem('userinfo'));
}
</script>
</html>

IE下本地HTML网页直接打开不支持 localStorage技术,直接发布服务器可以。

localStorage 存取与删除的更多相关文章

  1. H5的storage(sessionstorage&localStorage)简单存储删除

    众所周知,H5的storage有sessionstorage&localStorage,其中他们的共同特点是API相同 下面直接上代码,storage中的存储与删除: <!DOCTYPE ...

  2. H5的localStorage简单存储删除

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  3. localStorage存取储数组。(存对象同理)

    var array = ['111','222','333','444','555']; 存window.localStorage.setItem('array',JSON.stringify(arr ...

  4. session,cookie,sessionStorage,localStorage的相关设置以及获取删除

    一.cookie 什么是 Cookie? "cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScrip ...

  5. localStorage存值取值以及存取JSON,以及基于html5 localStorage的购物车

    localStorage.setItem("key","value");//存储变量名为key,值为value的变量 localStorage.key = &q ...

  6. HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  7. HTML5 本地存储 localStorage、sessionStorage 的遍历、存储大小限制处理

    HTML5 的本地存储 API 中的 localStorage 与 sessionStorage 在使用方法上是相同的,区别在于 sessionStorage 在关闭页面后即被清空,而 localSt ...

  8. 使用HTML5 Web存储的localStorage和sessionStorage方式

    localStorage(本地存储),可以长期存储数据,没有时间限制,一天,一年,两年甚至更长,数据都可以使用.sessionStorage(会话存储),只有在浏览器被关闭之前使用,创建另一个页面时同 ...

  9. 前端数据存储方案集合(cookie localStorage等)以及详解 (二)

    前端数据存储方案集合(cookie localStorage等)以及详解 (二) 在之前的文章中已经介绍到了 前端存储方案中的 cookie . 但是 cookie 的存储上限是 4KB. 如果超过了 ...

随机推荐

  1. WebApi 接口返回值类型详解 ( 转 )

    使用过Webapi的园友应该都知道,Webapi的接口返回值主要有四种类型 void无返回值 IHttpActionResult HttpResponseMessage 自定义类型 此篇就围绕这四块分 ...

  2. VMware虚拟机,从厚置备改成精简置备,并减小硬盘的实际占用空间

    工作中由于前期规划不足,导致磁盘空间分配较大,而且是厚置备.后期不再需要时,无法把用不到的空间释放出来,造成空间浪费.经过摸索和实验验证,总结出来一套方法. 风险提示:这个方法在我的环境中验证通过了, ...

  3. 从一个事件绑定说起 - DOM

    事件绑定的方式 给 DOM 元素绑定事件分为两大类:在 html 中直接绑定 和 在 JavaScript 中绑定. Bind in HTML 在 HTML 中绑定事件叫做内联绑定事件,HTML 的元 ...

  4. SpringCloud的服务消费者 (一):(rest+ribbon)访问注册的微服务

    采用Ribbon或Feign方式访问注册到EurekaServer中的微服务.1.Ribbon实现了客户端负载均衡,Feign底层调用Ribbon2.注册在EurekaServer中的微服务api,不 ...

  5. Python之面向对象二

    面向对象的三大特性: 继承 继承是一种创建新类的方式,在python中,新建的类可以继承一个或多个父类,父类又可称为基类或超类,新建的类称为派生类或子类 python中类的继承分为:单继承和多继承 c ...

  6. ActiveMQ学习系列(二)----生产者客户端(java)

    上文主要简单地将activeMq搭建了起来,并且可以用web console去登录查看相关的后台功能. 本文将学习如何用java语言实现一个生产者客户端,主要参考了以下链接: http://activ ...

  7. 【WebGL入门】画一个旋转的cube

    最近搜罗了各种资料,发现WebGL中文网特别好用,很适合新手入门:http://www.hewebgl.com/article/getarticle/50 只需要下载好需要的所有包,然后用notepa ...

  8. 真正理解拉格朗日乘子法和 KKT 条件

        这篇博文中直观上讲解了拉格朗日乘子法和 KKT 条件,对偶问题等内容.     首先从无约束的优化问题讲起,一般就是要使一个表达式取到最小值: \[min \quad f(x)\]     如 ...

  9. 基于DFS的拓扑排序

    传送门:Kahn算法拓扑排序 摘录一段维基百科上的伪码: L ← Empty list that will contain the sorted nodes S ← Set of all nodes ...

  10. Python面向对象——多重继承大揭秘

    1如果如图所示使用多重继承,我们将看到什么 2我们看到了基类被执行了两次Baseclass 3代码验证吧 class BaseClass: num_base_calls = 0 def call_me ...