HTML5技术

将数据库从服务器移到浏览器--indexedDB基本操作封装 - 大~熊(2)

字号+ 作者:H5之家 来源:H5之家 2017-06-20 10:01 我要评论( )

Document链接数据库添加数据 window.msIndexedDB; window.msIDBTransaction;window.IDBKeyRange window.msIDBKeyRange connectDB(name,version,success,update,error){let dbConnect = indexedDB.open(name,version

Document链接数据库添加数据 window.msIndexedDB; window.msIDBTransaction; window.IDBKeyRange window.msIDBKeyRange connectDB(name,version,success,update,error){ let dbConnect = indexedDB.open(name,version); dbConnect.onsuccess = function(e){ console.log(); success(e.target.result); } dbConnect.onerror = function(e){ console.log(); error(e); } dbConnect.onupgradeneeded = function(e){ update(e.target.result); let oldVersion = e.oldVersion; let newVersion = e.newVersion; console.log(newVersion); } } function createTable(idb,storeName,key,idxs){ idb){ console.log(idb); return ; } idxs){ console.log(); return ; } storeName){ console.log(); return ; } try{ idb.createObjectStore(storeName,key); console.log(); ){ idxs[i]; store.createIndex(idx.indexName,idx.keyPath,idx.optionalParameters); console.log(); } }catch(e){ console.log(); console.log(JSON.stringify(e)) } } function add(storeName,values){ connectDB((idb){ ); ts.objectStore(storeName); ){ (function(i){ values[i]; store.put(value); req.onsuccess = function(){ console.log(); } req.onerror = function(e){ console.log(); console.log(JSON.stringify(e)); } })(i) } ts.oncomplete = function(){ console.log(); } },(){}); } window.onload=function(){ let btn ); btn.onclick = function(){ connectDB(, function(idb){ console.log(); },function(idb){ createTable(idb,},[ { indexName:, keyPath:, optionalParameters:{ unique:true, multiEntry:false }}]); },function(){ console.log() }); } let add1 ); add1.onclick = function(){ add(}]) } }

 

 

  比较神奇的是你在建表的时候不需要指定你的字段,再添加数据时可以随便加。添加数据用到的是表对象的put方法,之前需要一个事务,从事务调个方法拿到存储对象(可以理解为表),具体看看例子就明白了。

四、查询数据

Document链接数据库添加数据查询 window.msIndexedDB; window.msIDBTransaction; window.IDBKeyRange window.msIDBKeyRange connectDB(name,version,success,update,error){ let dbConnect = indexedDB.open(name,version); dbConnect.onsuccess = function(e){ console.log(); success(e.target.result); } dbConnect.onerror = function(e){ console.log(); error(e); } dbConnect.onupgradeneeded = function(e){ update(e.target.result); let oldVersion = e.oldVersion; let newVersion = e.newVersion; console.log(newVersion); } } function createTable(idb,storeName,key,idxs){ idb){ console.log(idb); return ; } idxs){ console.log(); return ; } storeName){ console.log(); return ; } try{ idb.createObjectStore(storeName,key); console.log(); ){ idxs[i]; store.createIndex(idx.indexName,idx.keyPath,idx.optionalParameters); console.log(); } }catch(e){ console.log(); console.log(JSON.stringify(e)) } } function add(storeName,values){ connectDB((idb){ ); ts.objectStore(storeName); ){ (function(i){ values[i]; store.put(value); req.onsuccess = function(){ console.log(); } req.onerror = function(e){ console.log(); console.log(JSON.stringify(e)); } })(i) } ts.oncomplete = function(){ console.log(); } },(){}); } function select(storeName,count,callback){ connectDB((idb){ ; []; ); ts.objectStore(storeName); store.count(); ; req.onsuccess = function(){ total = this.result; count:total; ,Number.MAX_VALUE); req2 ); ; req2.onsuccess = function(){ .result; if(cursor){ cc++; data.push(cursor.value); realCount){ callback(data); return; } cursor.continue(); } } req2.onerror = function(){ console.log() } } },(){}); } window.onload=function(){ let btn ); btn.onclick = function(){ connectDB(, function(idb){ console.log(); },function(idb){ createTable(idb,},[ { indexName:, keyPath:, optionalParameters:{ unique:true, multiEntry:false }}]); },function(){ console.log() }); } let add1 ); add1.onclick = function(){ add(}]) } let selectBtn ); selectBtn.onclick = function(){ select((data){ console.log(data); }) } }

 

   查询操作主要用到了游标,这个说起来还比较多,没时间说了,自行google。还有很多的操作这里不讲了。给一个我封装的不是很好的简易库,仅供参考。

   一个简易库。

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 谈一下我们是怎么做数据库单元测试(Database Unit Test)的 - HarlanC

    谈一下我们是怎么做数据库单元测试(Database Unit Test)的 - HarlanC

    2017-06-17 12:00

  • 最新开源DBLayer,原来数据库操作可以这么简单 - 小小明

    最新开源DBLayer,原来数据库操作可以这么简单 - 小小明

    2017-06-15 17:01

  • 【线上问题】由防火墙导致的数据库空闲连接断开问题 - Trust_FreeDom

    【线上问题】由防火墙导致的数据库空闲连接断开问题 - Trust_FreeDom

    2017-06-15 16:00

  • C#简单构架之EF进行读写分离+多数据库(Mysql/SqlService) - 追随微笑

    C#简单构架之EF进行读写分离+多数据库(Mysql/SqlService) - 追随微笑

    2017-06-14 15:01

网友点评
p