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

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程序设计》第7周学习总结

    1. 本章学习总结 2. 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 public boolean contains(Object o) { re ...

  2. 201521123004 《Java程序设计》第12周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String name,int age,doubl ...

  3. 201521123112《Java程序设计》第13周学习总结

    1. 本周学习总结 协议的概念是网络中为了通信而建立的规则,常用的应用层协议有http,ftp等. 测试计算机之间的网络是否连通可以使用ping命令. 可以使用IP+端口号的方法来确定数据包是发给哪个 ...

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

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String name,int age,doubl ...

  5. Spring配置文件的命名空间URI

    Spring配置文件介绍 <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi=" ...

  6. Linux环境下启动MySQL数据库出现找不到mysqld.sock的解决办法!

    问题: 在普通用户权限下运行:mysql -u root -p,回车之后如果会出现如下错误:ERROR 2002 (HY000): Can't connect to local MySQL serve ...

  7. CSS3的颜色渐变效果

    在 animate.css寻找自己想要的动态效果,看到标题Animate.css和按钮Animate it的颜色在逐渐变化,觉得蛮有趣的,把控制变化的相关代码扒了下来,自己分析实现一波. 一开始认为使 ...

  8. Eclipse插件springsource-tool-suite在线和离线安装步骤

    springsource-tool-suite插件是一个基于Eclipse的开发环境,为开发Spring应用程序而定制.它提供了一个即用的环境来实现,调试,运行和部署Spring应用程序,包括Pivo ...

  9. 【轉】使用jQuery播放/暂停 HTML5视频

    jQuery不可以使用play()方法,但js是可以的: document.getElementById('movie1').play();   解决方法:play并不是jQuery的函数,而是DOM ...

  10. JavaScript中的alert、confirm、prompt

    alert: var a=alert('Alert');//界面只有一個確定alert(a);   //返回值為undefined confirm: var c= confirm('Confirm') ...