本地缓存是HTML5出现的新技术,这个技术的出现使得移动web的开发成为了可能。我们都知道。要想打造一个高性能的移动应用,速度是关键。而在HTML5之前。仅仅有cookie可以存储数据,大小仅仅有4kb。这严重限制了应用文件的存储,导致web开发的移动应用程序须要较长的载入时间。有了本地存储,让web移动应用可以更接近原生。

浏览器中,本地存储通过window.localStorage调用。推断浏览器是否支持本地存储的代码例如以下:

if(window.localStorage){
alert('This browser supports localStorage');
}else{
alert('This browser does NOT supportlocalStorage');
}

假设我们要将数据存储到本地。最简单的方法就是为window。

localStorage加入一个属性并为其赋值。

比如我们要存储一个数据name。它的值为Tom,就能够通过例如以下方式实现:

window.localStorage.name = “Tom”

这里要注意字符串变量须要引號。当我们想取出本地存储中的数据市。能够利用getItem方法。整个代码流程例如以下:

var storage = window.localStorage;
storage.name = “Tom”;
//取出name数据
var name1 = storage.getItem(“name”);
alert(name1);

这段代码在Chrome浏览器控制台中的显示结果就是一个显示Tom的提示框。可见我们已经通过这样的方式正确的进行了数据的存储与读取。

假设我们想删除这些存储的数据。能够使用removeItem方法。在以上代码中增加例如以下代码:

storage.removeItem(“name”);

这时当我们再次alert的时候将显示null。由于这个数据已经被清空了。

HTML5移动开发实战必备知识——本地存储(1)的更多相关文章

  1. HTML5移动开发实战必备知识——本地存储(2)

    了解了一些主要的本地存储使用方法和思想后.我们来系统的介绍一下本地存储. 本地存储分为三大类:localStorage/sessionStorage/本地数据库 localStorage和sessio ...

  2. HTML5 学习总结(三)——本地存储

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

  3. HTML5 学习笔记(三)——本地存储

    目录 一.HTML4客户端存储 1.1.提交表单发送到服务器的信息 1.2.客户端本地存储概要 二.localStorage 2.1.添加 2.2.取值 2.3.修改 2.4.删除 2.5.跨页面与跨 ...

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

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

  5. HTML5游戏开发实战--当心

    1.WebSocket它是HTML5该标准的一部分.Web页面可以用它来连接到持久socketserver在.该接口提供一个浏览器和server与事件驱动的连接.这意味着client每次需要时不再se ...

  6. HTML5 学习总结(三)——本地存储(localStorage、sessionStorage、WebSqlDataBase、IndexedDB)

    HTML5问世以后,前端加入了一个重要的功能,便是本地存储,本地存储可分为4类: Local Storage:总的存储量有所限制,并不能提供真正的检索API,数据的生命期比窗口或浏览器的生命期长,数据 ...

  7. HTML5系列三(多媒体播放、本地存储、本地数据库、离线应用)

    各浏览器对编码格式的支持情况 audio和video元素的属性介绍 1.src:媒体数据的URL地址 <video src="pr6.mp4"></video&g ...

  8. iOS开发查看手机app本地存储的文件

    开发过程中,有时会在本地存储一些文件,但是我们不确定有没有存上,可以通过以下方法来查看测试手机上本地存储的文件: 1.选择xcode上面的window下面的Devices 2.先在左边选中你当前的设备 ...

  9. HTML5规范的本地存储

    在HTML5 中定义了两种本地存储的,Web Storage 和本地数据库 SQL Database . 用来检查判断浏览器是否支持 Web Storage if(window.localStorag ...

随机推荐

  1. Ubuntu配置sublime text 3的c编译环境

    新建编译系统 c语言 选择tool –> Build System –> New Build System 然后输入下面代码 { "shell_cmd": " ...

  2. java 并发原子性与易变性 来自thinking in java4 21.3.3

    java 并发原子性与易变性  具体介绍请參阅thinking in java4 21.3.3 thinking in java 4免费下载:http://download.csdn.net/deta ...

  3. docker第一章

    简介 Docker 是 Docker.Inc 公司开源的一个基于 LXC技术之上构建的Container容器引擎, 源代码托管在 GitHub 上, 基于Go语言并遵从Apache2.0协议开源. D ...

  4. 【ASP.NET开发】.NET三层架构简单解析

    对于三层架构来说,主要是使用设计模式的思想,对于项目的各个模块实现"高内聚,低耦合"的思想.这里就不做详细的介绍了,如果大家有兴趣,可以阅读软件工程和设计模式相关文章. 对于三层架 ...

  5. 【CS Round #44 (Div. 2 only) D】Count Squares

    [链接]点击打开链接 [题意] 给你一个0..n和0..m的区域. 你可以选定其中的4个点,然后组成一个正方形. 问你可以圈出多少个正方形. (正方形的边不一定和坐标轴平行) [题解] 首先,考虑只和 ...

  6. [置顶] WebService学习总结(3)——使用java JDK开发WebService

    一.WebService的开发手段 使用Java开发WebService时可以使用以下两种开发手段 1. 使用JDK开发(1.6及以上版本) 2.使用CXF框架开发(工作中) 二.使用JDK开发Web ...

  7. BZOJ——3343: 教主的魔法 || 洛谷—— P2801 教主的魔法

    http://www.lydsy.com/JudgeOnline/problem.php?id=3343  ||  https://www.luogu.org/problem/show?pid=280 ...

  8. Eclipse中开发环境也想把Tomcat 的默认BIO模式改为NIO模式

    1.1 问题 有时候,开发环境我们也想把Tomcat 的默认BIO模式改为NIO模式,该如何改呢? 1.2 方案 通过eclipse里面的server.xml进行修改. 1.3 步骤 首先我们来一起看 ...

  9. [D3] Margin Convention with D3 v4

    You can’t add axes to a chart if you don’t make room for them. To that end, the D3 community has ado ...

  10. 辛星解读之php中的重点函数第一节之数组函数

    这里我已经写好它的pdf版本号了,比本博客更加适合阅读.首先说一下它在百度网盘的下载地址把:百度网盘下载 ,假设左边连接跪了.能够在浏览器中输入:http://pan.baidu.com/s/1qW5 ...