使用 IndexedDB

IndexedDB 是一种可以让你在用户的浏览器内持久化存储数据的方法。IndexedDB 为生成 Web Application 提供了丰富的查询能力,使我们的应用在在线和离线时都可以正常工作。

关于本文档

本篇教程将教会你如何使用 IndexedDB 的异步 API。如果你对 IndexedDB 还不熟悉,你应该首先阅读有关 IndexedDB 的基本概念

有关 IndexedDB API 的参考手册,请参见 IndexedDB 这篇文章及其子页面,包括 IndexedDB 使用的对象类型,以及同步和异步 API 的方法。

基本模式

IndexedDB 鼓励使用的基本模式如下所示:

  1. 打开数据库并且开始一个事务。
  2. 创建一个 object store。
  3. 构建一个请求来执行一些数据库操作,像增加或提取数据等。
  4. 通过监听正确类型的 DOM 事件以等待操作完成。
  5. 在操作结果上进行一些操作(可以在 request 对象中找到) (更多…)

没有 setVersion 了,现在是 onupgradeneeded !

默认情况下,IndexedDB 数据库是没有版本号的。新版本的 IndexedDB 规范不支持调用setVersion()方法为数据库指定一个版本号(传入一个表示版本号的字符串);代替的方法是在 open() 的时侯传入表示版本号的字符串,同时使用 onupgradeneeded 事件代替了 setVersion() 方法。onupgradeneeded 事件会在 onsuccess 之前被调用。[sourcecode lang=”javascript”]
tfan.indexedDB.open = function() {
var request = indexedDB.open(‘parser17103’, 1);

request.onupgradeneeded = function(event) {
console.log("onupgradeneeded", event.currentTarget.result);
var store = event.currentTarget.result.createObjectStore(‘question’, {keyPath: "question_id"});
tfan.indexedDB.getAllQuestionItems();
};

request.onsuccess = function(event) {
console.log("open success");
tfan.indexedDB.db = event.target.result;
};

request.onerror = tfan.indexedDB.onerror;
};</pre>
</article>
[/sourcecode]

更多请参考:

HTML5 Web 开发培训讲义

为 HTML5 培训准备的部分讲义,希望对大家能有所帮助。
(Note: 观看 slides 的时候,键盘上下左右键可以控制翻页,还可以使用 Ctrl + (+ 或 -) 控制显示大小)

HTML5 技术体系简介

HTML5 新元素

Web Storage

Web Workers – JavaScript 并发

HTML5 文件访问

JavaScript 最佳实践

CSS3 新特性

HTML5 Canvas, Audio & Video

HTML5 Geolocation – 地理位置信息

构建离线 Web 应用

设备方向和多点触控

HTML5 Web Socket – 持久连接和双向通信

HTML5 简史

1991年: 初版

  • 在1980年,伯纳斯-李提议并构造了 ENQUIRE 系统的原型,是一个给 CERN 的研究员们使用和共享文档的系统。
  • 1989年,伯纳斯-李写了一份备忘录,提出建立一个基于互联网的超文本系统。同年和另外一个工程师一起进行联合资金申请,但是这个项目并没有被 CERN 正式通过。
  • 1991年底的时候,伯纳斯-李公开了一份“HTML Tag”的文档,里面描述了组成HTML初始版本的18个元素。

第一次关于 HTML 的公开描述

(更多…)