从陌生到了解,花了一下午的时间,以下的地址还是不错的参考资料,省的到处去找

HTML5本地存储——IndexedDB(一:基本使用)

官方API接口文档

官方使用示例

html5 初试 indexedDB

给一个自己练习的DEMO

var dbName = "myDB";
var tdbName = "student";
function openDB(dbname,version){
version = version || 1; var request = getIndexedDB().open([dbName],version);
request.onerror=function(e){
console.log("打开数据库失败");
}
request.onsuccess=function(e){
console.log("打开数据库成功");
db = e.target.result;
}
request.onupgradeneeded=function(e){
db = e.target.result;
if(!db.objectStoreNames.contains('student')){
db.createObjectStore(['student'],{keyPath:"name"});
console.log("创建表student");
}
}
}
function writeInDB(dbName,tdbName,objValue){
var transaction = dbName.transaction(tdbName,"readwrite");
var objectStore = transaction.objectStore(tdbName);
var addrequest;
for(var i in objValue){
addrequest = objectStore.add(objValue[i]);
}
addrequest.onerror=function(e){
console.log("插入数据失败");
}
addrequest.onsuccess=function(e){
console.log("插入数据成功");
}
}
var db = openDB(dbName);
var stud = [{name:'Li',age:20},{name:'Zhao',age:12}]; function readFromDB(db,tdbName){
var store = db.transaction(tdbName,"readwrite").objectStore(tdbName);
store.openCursor().onsuccess=function(e){
var cursor = e.target.result;
if(cursor){
console.log(cursor.key);
console.log(cursor.value);
cursor.continue();
}
}
} function removeFromDB(db,tdbName,key){
var store = db.transaction(tdbName,"readwrite").objectStore(tdbName);
store.delete(key);
}
readFromDB(db,tdbName);//读取数据
removeFromDB(db,tdbName,'Li');//移出key为"Li"的数据
writeInDB(db,tdbName,[{name:"Li",age:22,sex:1}]);
writeInDB(db,tdbName,[{name:"Lilly",age:22,sex:1}]);//插入两条记录

HTML5之indexedDB的更多相关文章

  1. html5 初试 indexedDB

    indexedDB是存储大量结构化数据的API,demo中用到的是异步API,麻烦的就是所有对indexedDB的操作都会发生一个异步的‘请求’,只要熟悉了API操作起来也很简单. http://ww ...

  2. HTML5之IndexedDB使用详解

    随着firefox4正式版的推出,IndexedDB正式进入我们的视线.IndexedDB是HTML5-WebStorage的重要一环,是一种轻量级NOSQL数据库.相较之下,WebDataBase标 ...

  3. 使用 HTML5 的 IndexedDB API

    1. [代码]判断是否支持 IndexedDB     var indexedDB = window.indexedDB || window.webkitIndexedDB || window.moz ...

  4. IndexedDB参考资料网址

    IndexedDB:浏览器里内置的数据库, Web骇客 http://www.webhek.com/indexeddb/ 前端的数据库:IndexedDB入门(很全面) http://web.jobb ...

  5. JavaScript的客户端存储

    一.前言: 客户端存储实际上就是Web浏览器的记忆功能,通过浏览器的API实现数据存储到硬盘: 二.存储的不同形式: 1.Web存储:localStorage 和 sessionStorage 代表同 ...

  6. 浏览器相关--H5本地存储

    因为项目需要,最近研究了一下HTML5本地存储相关的东西,在这简单的记录一下. 浏览器存储主要包括一下几个部分1. cookie2. localStorage3. sessionStorage4. i ...

  7. HTML5存储之 indexedDB

    IndexeDB是HTML5 重要的一部分,它是一种轻量级的NOSQL数据库.对创建具有丰富本地存储数据的数据密集型的离线HTML5 Web 应用程序很有用. IndexedDB是为了能够在客户端存储 ...

  8. HTML5本地存储——IndexedDB(一:基本使用)

    在HTML5本地存储——Web SQL Database提到过Web SQL Database实际上已经被废弃,而HTML5的支持的本地存储实际上变成了 Web Storage(Local Stora ...

  9. HTML5本地存储——IndexedDB(二:索引)

    在HTML5本地存储——IndexedDB(一:基本使用)中介绍了关于IndexedDB的基本使用方法,很不过瘾,这篇我们来看看indexedDB的杀器——索引. 熟悉数据库的同学都知道索引的一个好处 ...

随机推荐

  1. 201521123110 《JAVA程序设计》第3周学习总结

    1.本章学习总结 ` ` 2.书面作业 1.代码阅读 public class Test1 { private int i = 1;//这行不能修改 private static int j = 2; ...

  2. evak购物车-课程设计(201521123034陈凯欣)

    1.团队课程设计博客链接 https://i.cnblogs.com/EditPosts.aspx?postid=7047127 2.个人负责模块或任务说明 1.Java 编写商品类Goods,商品属 ...

  3. 201521123036 《Java程序设计》第10周学习总结

    本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 书面作业 本次PTA作业题集异常.多线程 finally 题目4-2 1.1 截图你的提交结果(出现学号) 1.2 ...

  4. 《JAVA程序设计》第13周学习总结

    1. 本章学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. GET / HTTP/1.0可以返回一个HTML格式的文本页 IP地址可以用来标识网络上的主机 Socke ...

  5. 时间效率:最小的K个数

    输入n个整数,找出其中最小的K个数.例如输入4,5,1,6,2,7,3,8这8个数字,则最小的4个数字是1,2,3,4,. import java.util.ArrayList; import jav ...

  6. MySQL集群(四)之keepalived实现mysql双主高可用

    前面大家介绍了主从.主主复制以及他们的中间件mysql-proxy的使用,这一篇给大家介绍的是keepalived的搭建与使用! 一.keepalived简介 1.1.keepalived介绍 Kee ...

  7. 简洁灵活的前端框架------BootStrap

      前  言 Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷.[1] ...

  8. Centos6.7安装chrome

    cd /etc/yum.repos.dwget http://people.centos.org/hughesjr/chromium/6/chromium-el6.repo yum install c ...

  9. Codeforces Round #436 (Div. 2) C. Bus

    http://codeforces.com/contest/864/problem/C 题意: 坐标轴上有x = 0和 x = a两点,汽车从0到a之后掉头返回,从a到0之后又掉头驶向a...从0到a ...

  10. 我的第一个python web开发框架(3)——怎么开始?

    小白与小美公司经过几次接触商谈,好不容易将外包签订了下来,准备开始大干一场.不过小白由于没有太多的项目经验,学过python懂得python的基本语法,在公司跟着大家做过简单功能,另外还会一些HTML ...