您的位置:首页 > Web前端 > HTML5

html5d的indexDB使用

2015-10-17 11:12 453 查看

html5d的indexDB使用

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script>
var myDB={
name:"helloindexDB",
version:2,
db:null
}
function openDB(name,version){
var version=version||2;
var request=window.indexedDB.open(name,version);
request.onerror=function(e){
alert("发送错误");
}
request.onsuccess=function(e){
myDB.db= e.target.result;
alert("成功");
}
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("ageIndex","age",{unique:false});
}
}

}
var students=[{
id:101,
name:"aa",
age:10
}, {
id:102,
name:"bb",
age:20
},{
id:103,
name:"cc",
age:11
},{
id:104,
name:"dd",
age:11
},{
id:105,
name:"ff",
age:19
}];
//添加数据
function addData(db,storeName){
var transaction=db.transaction(storeName,"readwrite");
var store=transaction.objectStore(storeName);
for(var i=0;i<students.length;i++){
store.add(students[i]);
}
}
openDB(myDB.name,myDB.version);
setTimeout(function(){
addData(myDB.db,"students")
},1000);
//获得数据
//        function getDataByIndexName(db,storeName){
//            var transaction=db.transaction(storeName);
//            var store=transaction.objectStore(storeName);
//            var index=store.index("nameIndex");
//            index.get("aa").onsuccess=function(e){
//                var student= e.target.result;
//                console.log(student.id+"--"+student.name+"--"+student.age);
//            }
//        }
//        setTimeout(function(){
//            getDataByIndexName(myDB.db,"students")
//        },1000);
//游标的使用
//        function fetchStoreByCursor(db,storeName){
//            var transaction=db.transaction(storeName);
//            var store=transaction.objectStore(storeName);
//            var request=store.openCursor();
//            request.onsuccess=function(e){
//                var cursor= e.target.result;
//                if(cursor){
//                    console.log(cursor.key);
//                    var currentStudent=cursor.value;
//                    console.log(currentStudent.name);
//                    cursor.continue();
//                }
//            }
//        }
//        setTimeout(function(){
//            fetchStoreByCursor(myDB.db,"students");
//        },1000);
//index与游标配合
function getData(db,storeName){
var transaction=db.transaction(storeName);
var store=transaction.objectStore(storeName);
var index=store.index("ageIndex");
var request=index.openCursor(IDBKeyRange.only(11));
request.onsuccess=function(e){
var cursor= e.target.result;
if(cursor){
var student=cursor.value;
document.writeln(student.id);
cursor.continue();
}
}
}
setTimeout(function(){
getData(myDB.db,"students");
},1000);
function getDataFanwei(db,storeName){
var transaction=db.transaction(storeName);
var store=transaction.objectStore(storeName);
var index=store.index("ageIndex");
//            IDBKeyRange.only(value)只获得指定数据
//            IDBKeyRange.lowerBound(value,isOpen);获得最新value,isOpen是否包含value
//            IDBKeyRange.upperBound(value,isOpen);
//            IDBKeyRange.bound(value1,value2,isOpen1,isOpen2)
var request=index.openCursor(IDBKeyRange.only(11));
request.onsuccess=function(e){
var cursor= e.target.result;
if(cursor){
var student=cursor.value;
document.writeln(student.id);
cursor.continue();
}
}
}
setTimeout(function(){
getDataFanwei(myDB.db,"students");
},1000);

</script>
</head>
<body>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: