<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>HTML5</title>

<script type="text/javascript">

	var index = 1;

	function add() {

		localStorage.setItem('key' + index,'hello,html5');

		index ++;

		alert('增加成功！');

	}

	function update() {

		localStorage.setItem('key1','你好，HTML5');

		alert('更新成功！');

	}

	function del() {

		localStorage.removeItem('key1');

		alert('删除成功！');

	}

	function query() {

		alert(localStorage.getItem('key1'));

	}

	function clearAll() {

		alert('清除了' + localStorage.length + '个元素');

		localStorage.clear();

	}

	function queryByIndex() {

		alert('下标为0的key：' + localStorage.key(0));

	}

</script>

</head>

<body>

<input type="button" value="增加" onClick="add();">

<input type="button" value="修改" onClick="update();">

<input type="button" value="删除" onClick="del();">

<input type="button" value="查询" onClick="query();">

<input type="button" value="清除全部" onClick="clearAll();">

<input type="button" value="获得key" onClick="queryByIndex();">

</body>

</html>

　　

16-1 WEB存储基本操作的更多相关文章

  1. web 存储方式汇总：Cookies,Session, Web SQL; Web Storage(LocalStorage ,SessionStorage),IndexedDB,Application Cache,Cache Storage

    1 1 1 web 存储方式汇总: 旧的方式: Cookies; Session; Web SQL; 新的方式 HTML5 : Web Storage(LocalStorage ,SessionSto ...

  2. html5的web存储

    在html5标准之前,web存储信息需要cookie来完成,但是cookie不适合大量数据存储.因为需要等待服务器响应,所以速度慢/效率低. 本地存储的特点: localstorage是仅存储在用户的 ...

  3. 临时存存储页面上的数据---Web存储

    HTML5 Web存储的两种方法使用 localStorage和sessionStorage 参考: http://www.cnblogs.com/taoweiji/archive/2012/12/0 ...

  4. 【读书笔记】HTML5 Web存储

    PS:这里讲web存储,主要是在客户端存储的一些技术:cookie,localstorage,sessionstorage,WebSQL.     Cookie   Cookie是HTML4中在客户端 ...

  5. 【html5】Web存储_locaStorage对象的应用

    Web存储 html5可以在本地存储用户浏览的数据,数据的存储原理是以 键/值 存储的 存储对象分类 localStorage:没有时间限制的数据存储 sessionStorage:针对一个会话的数据 ...

  6. 【高级功能】使用Web存储

    Web存储允许我们在浏览器里保存简单的键/值数据.Web存储和cookie很相似,但它有着更好的实现方式,能保存的数据量也很大.这两种类型共享相同的机制,但是被保存数据的可见性和寿命存在区别. PS: ...

  7. 【温故而知新-Javascript】使用Web存储

    Web存储允许我们在浏览器里保存简单的键/值数据.Web存储和cookie很相似,但它有着更好的实现方式,能保存的数据量也很大.这两种类型共享相同的机制,但是被保存数据的可见性和寿命存在区别. PS: ...

  8. Web存储(Web Storage)的浏览器支持情况

    所有很酷的功能特征的出现最关键的就是浏览器的支持情况,幸运的是,所有的现代浏览器都支持HTML5 Web存储(Web Storage),从IE8开始也支持它.HTML5 Web存储(Web Stora ...

  9. HTML5本地化应用开发-HTML5 Web存储详解

    文章不是简单的的Ctrl C与V,而是一个字一个标点符号慢慢写出来的.我认为这才是是对读者的负责,本教程由技术爱好者成笑笑(博客:http://www.chengxiaoxiao.com/)写作完成. ...

随机推荐

  1. win10 localhost 解析为::1 的解决办法

    win10 localhost 解析为::1 的解决办法 学习了:https://blog.csdn.net/ambertian/article/details/70238020

  2. Android调试工具_ Stetho

    Stetho是Facebook开源的一个Android平台调试工具. Stetho能实如今不root手机的情况下,通过Chrome查看App的布局,Sqlite,SharedPreference.Ne ...

  3. ubuntu安装nginx时提示error: the HTTP rewrite module requires the PCRE library

    ubuntu安装nginx时提示error: the HTTP rewrite module requires the PCRE library 须要安装pcre包. sudo apt-get upd ...

  4. OpenLayers3基础教程——OL3基本概念

    从本节開始,我会陆陆续续的更新有关OL3的相关文章--OpenLayers3基础教程,欢迎大家关注我的博客,同一时候也希望我的博客可以给大家带来一点帮助. 概述: OpenLayers 3对OpenL ...

  5. Qt移动应用开发（四）：应用粒子特效

    Qt移动应用开发(四):应用粒子特效 上一篇文章介绍了Qt Quick是如何对帧动画进行支持的.帧动画的实现离不开状态机.而状态机.动画和状态切换(transitions)则是Qt框架的核心内容.也就 ...

  6. Redis 命令行 常用总结

    http://www.redis.cn/commands.html# 1 Keys * 列出所有的keys redis > keys * ) "s:0" ) "o: ...

  7. web.xml文件中各个配置的说明

    <?xml version="1.0" encoding="UTF-8"?><web-app xmlns:xsi="http://w ...

  8. Visual Studio 2017中使用正则修改部分内容 如何使用ILAsm与ILDasm修改.Net exe(dll)文件 C#学习-图解教程(1)：格式化数字字符串 小程序开发之图片转Base64（C#、.Net） jquery遍历table为每一个单元格取值及赋值 。net加密解密相关方法 .net关于坐标之间一些简单操作

    Visual Studio 2017中使用正则修改部分内容   最近在项目中想实现一个小工具,需要根据类的属性<summary>的内容加上相应的[Description]特性,需要实现的效 ...

  9. OpenCV图像处理篇之图像平滑

    图像平滑算法 图像平滑与图像模糊是同一概念,主要用于图像的去噪.平滑要使用滤波器.为不改变图像的相位信息,一般使用线性滤波器,其统一形式例如以下: %20\Large%20g(i,j)=\sum_{k ...

  10. cocos2d-x中锚点设置及定位方式

    问题 在cocos2d演示样例代码HelloCpp中,为什么要将CCMenu设置位置到CCPointZero,即使CCMenu的锚点是在(0.5, 0.5)? 回答 这是由于CCMenu没有使用锚点进 ...