H5 API-IndexedDB(客户端数据库)

IndexedDB为了在客户端存储大量的结构化数据，并且使用索引高效检索的API。

---

# 简单使用

var request=window.indexedDB.open('jaxi',1); //打开或创建一个数据库 

request.onerror=function(e){//打开数据库错误时执行
   console.log(e.currentTarget.error.message);
}

request.onsuccess=function(e){//打开数据库正确时执行
  myDB=e.target.result;
  //表添加数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
      t.add({id:1004,name:'jaxi',age:'12'})

  //表删除数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
      t.delete(1001);

//表更改数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
      t.put({id:1007,name:'jaxxi',age:'95'});

//表查询数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
      t.get(1001);
  
}
request.onupgradeneeded=function(e){//打开数据库版本检测(也可用来添加表)
  var db=e.target.result;
  if(!db.objectStoreNames.contains('students')){
    db.createObjectStore('students',{keyPath:'id'});
  }
}
# 解释:
  1.db.objectStoreNames.contains('students');//数据库中是否包含这个表
  2.db.createObjectStore('students',{keyPath:'id'});//数据库创建一个表并指定id
  3.myDB.transaction('students','readwrite').objectStore('students');
    //表事务(表名,'操作方式').objectStore('预操作表')
  4.t.add();表添加数据                t.put();表更新数据  
  5.t.delete('字段值');表删除数据      t.get();表查询数据  
  6.db.close();关闭数据库
  7.indexedDB.deleteDatabase(‘dbName’);删除数据库

# 利用游标和索引来获取数据

同上一样（在数据库版本检测时，需要创建索引）
request.onupgradeneeded=function(e){//打开数据库版本检测(也可用来添加表)
  var db=e.target.result;
  if(!db.objectStoreNames.contains('students')){
    var store=db.createObjectStore('students',{keyPath:'id'});
    store.createIndex('nameIndex','name',{unique:true});
    //创建索引store.createIndex('索引名称','索引属性名',{unique:true}索引属性值是否唯一);
    store.createIndex('ageIndex','age',{unique:false});
  }
}

//利用游标查询表数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
  var reques=t.openCursor();//新建一个游标
      reques.onsuccess=function(e){
          var cursor=e.target.result;
          if(cursor){
              var currentStudent=cursor.value;
              console.log('Key:'+cursor.key+" Value:"+currentStudent.name);
              cursor.continue();//游标下移,没有返回undefined
          }
      };


  //游标与索引结合查询表数据
  var t=myDB.transaction('students','readwrite').objectStore('students');
  var index=t.index('ageIndex');//指定索引
  var reques=index.openCursor(IDBKeyRange.only(26));
  //新建一个游标 指定是26岁
      reques.onsuccess=function(e){
          var cursor=e.target.result;
          if(cursor){
              var currentStudent=cursor.value;
              console.log('Key:'+cursor.key+" Value:"+currentStudent.name);
          }
      };