html5d的indexDB使用

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>

你可能感兴趣的:(html5,indexDB)