以前学习.net开发时用过数据库。现在前端也可以用了。
indexedDB:
1、创建、获取:
open会返回一个IDBOpenDBRequest对象,参数中数据名,版本
var req=indexedDB.open('test',1.0);
成功回调函数内可获取db对象,可来操作数据库
req.onsuccess=function(e){
var db=e.target.result;//获取数据库对象。
}
此回调函数在版本变化时执行。此函数内可以用来第一次时创建表(集合),或删除表,和添加索引
req.onupgradeneeded=function(e){
db=e.target.result;
}
req.onerror=function(e){
}
2、创建、删除表,和创建索引
//创建自动增加表,
db.createObjectStore('user',{autoIncrement:true});
//创建主键名,这样在添加时需定义rollNo属性值,且需唯一
var store=db.createObjectStore('students',{ keyPath : "rollNo" });
//创建表后可添加索引,参数:索引名,字段名,配置对象。此索引键值不需为一
store.createIndex('nameindex','name',{unique:false});
//判断有有表删除它
if (db.objectStoreNames.contains('students')) {
db.deleteObjectStore("students")
}
3、事务
在处理数据时需要先开一个事务,指定事务中处理的object stroe 和模式
read 只读 readwrite 读写 verionchange版本变动
//创建事件,参数一数组指定操作的表名
var transaction=db.transaction(['students'],'readwrite');
事务可以绑定成功或失败回调。
transaction.oncomplete=function(e){
console.log('事务成功')
}
transaction.onerror = function(event) {
console.log("Error");
};
在创建事务后就可以来操作事务中的表了,
使用前需要从事务中获取处理的表
然后再add get delete put .可以赋值这些方法值。监听onsuccess来获取成功回调。
req.result获取返回值。
4、操作表
添加
objectStore = transaction.objectStore("students");//获取表对象,
objectStore.add({rollNo: rollno, name: name});
删除记录,需要传递id,默认是主键的id,或是自动增加表的id
var req=transaction.objectStore('students').delete(rollno);
req.onsuccess=function(){
console.log('delete success'+req.result);//req.result获取成功返回的结果
}
修改:
//先用get获取数据
var req=objectStore.get(rollno);
//成功里修改result的值。用objectStore.put方法实现修改
req.onsuccess=function(){
$("#result").html("Updating : "+req.result.name + " to " + name);
req.result.name=name;
objectStore.put(req.result);
}
清除表内所有数据
var req=transaction.objectStore('students').clear();
req.onsuccess=function(){
console.log('clear 成功')
}
4、游标:
var req=objectstore.openCursor();
/*监听成功函数,获取e.target.result。这是一个对象,内有下一个游标方法 */
默认游标获取所有表内数据,e.target.result获取结果对象。
可判断它,通过value获取记录对象,value.XX获取字段值。
continue()循环下一条。
req.onsuccess=function(e){
var r=e.target.result;
console.log(e);
if(r){
var listItem = document.createElement('li');
listItem.innerHTML = r.value.rollNo + ', ' + r.value.name;
$("#result").append(listItem);
r.continue();
}else{
console.log('getall error')
}
}
游标参数有二个参数,一是数据查询对象,二是游标方向(不常用)
IDBCursor.NEXT 顺序循环
IDBCursor.NEXT_NO_DUPLICATE 顺序循环不重复
IDBCursor.PREV 倒序循环
IDBCursor.PREV_NO_DUPLICATE 倒序循环不重复
游标默认是获取所有数据,但它最大的用处是和索引搭配使用。
var transaction=db.transaction(['students'],'readwrite');
var objectStore=transaction.objectStore('students');
var myindex=objectStore.index('nameindex');//按nameindex 索引搜索
//再用游标来获取列表,会按索引属性值来排序
myindex.openCursor().onsuccess=function(e){
var cursor=e.target.result;
if(cursor){
var listItem = document.createElement('li');
listItem.innerHTML = cursor.value.rollNo + ', ' + cursor.value.name;
$("#result").append(listItem);
cursor.continue();
}else{
console.log('getall error')
}
}
//索引也可用get来查询:根据name索引用get获取name=XX的记录
myindex.get($('#name').val()).onsuccess=function(e){
console.log(e.target.result);
}
游标查询还有更好用的:
/*IDBKeyRange.only(value):只获取指定数据
*IDBKeyRange.lowerBound(value,isOpen):获取最小是value的数据,第二个参数用来指示是否排除value值本身,也就是数学中的是否是开区间
* IDBKeyRange.upperBound(value,isOpen):和上面类似,用于获取最大值是value的数据
* IDBKeyRange.bound('b','f',isOpen1,isOpen2) 获取首字母在b-f的记录
*/
//获取name=XX的所有记录
var req=myindex.openCursor(IDBKeyRange.only($('#name').val())).onsuccess=function(e){
var cursor=e.target.result;
if(cursor){
var student=cursor.value;
console.log(student);
cursor.continue();
}
}