HTML5之indexedDB

时间:2023-03-09 17:52:25
HTML5之indexedDB

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

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}]);//插入两条记录