什么是IndexedDB
indexedDB是一种轻量级NOSQL数据库，是由浏览器自带。比拟Web Sql越发高效，包含索引、事宜处理和查询功用。在HTML5当地存储中，IndexedDB存储的数据是最多的，不像webStorage的4M，IndexedDB存储空间是无上限且永远的。
为何要用IndexedDB
因为我们的大佬W3C不喜欢Web Sql(Sqlite)啊233，大佬都已摒弃了Web Sql，力推IndexedDB
Web Sql API的重要完成者是Chrome、Safari、Opera、Android、IOS、BB。IE和FF都不支撑Web Sql API。
IndexedDB因为遭到W3C的推重。浏览器厂商的完成状况要好一些。
注：横竖IndexedDB跟Web Sql都是旗鼓相当
IndexedDB的特性
支撑事宜、游标、索引等数据库操纵
存储空间大
永远存储，删除缓存不滋扰IndexedDB
异步性
各大浏览器对IndexedDB的支撑状况：
IE10+(亲测IE10跪=.=)
Firefox 10+、Chrome 23+、Opera 15+
iPhone ios8-ios10 safari支撑(X5内核不支撑)
Android X5内核支撑
注：挪动端种种坑，在没什么把握之前千万别像我一样作死去弄挪动端
IndexedDB经常使用功用代码演示
因为我是做了一个小Demo，所以临时用这个Demo的代码，伪代码人人看看就好，背面会附上完全源码地点233
建立数据库
function createdatabase() {
var resource = window.indexedDB.open("managerDB",1);//建立一个名为managerDB的数据库，数目为1
resource.onsuccess = function(event) {
database = resource.result;//让数据库能在任何地方接见
};
resource.onerror = function(event) {//数据库建立失利事宜
alert("can't create database,error:" + resource.error);
};
resource.onupgradeneeded = function(event) {//第一次建立数据库新建一张名为managerList的数据表
var db = resource.result;
var objectStore = db.createObjectStore("managerList",{keyPath:"time"});//key为time
};
}onupgradeneeded事宜会在数据库版本不同时触发（event.oldVersion 能够猎取当前数据库版本），能够用来晋级数据库(增加删除数据表),此事宜也会在所要求的数据库不存在的时刻触发，会自动建立一个空数据库。
存储数据
假如挪用put()增加的数据与已存在的数据有雷同的key，浏览器会将新数据替代已存在的数据。
function save() {
var contact = new Object();//新建一个对象
var Name = document.getElementById("name").value;
var Time = getSelect();
var Description = document.getElementById("description").value;
if(JTrim(Name) != "" && JTrim(Description) != "") {//JTrim()函数是用于推断输入是不是为空值
contact.name = Name;
contact.time = Time;
contact.description = Description;
var transaction = database.transaction(["managerList"],"readwrite");//读写
var resource = transaction.objectStore("managerList").put(contact);//应用put()将数据存入
} else {
alert("you should write something...");
return;
}
resource.onsuccess = function(event) {//胜利
alert("create note success!");
};
resource.onerror = function(event) {//失利
alert("can't create database,error:" + resource.error);//示知毛病
};
}
JTrim()函数
function JTrim(s) {
return s.replace(/(^\s*)|(\s*$)/g, "");
}遍历悉数数据
应用IndexedDB的API来遍历数据的时刻，须要用到游标，熟习数据库的列位应当清晰游标的用法
function loadAll() {
var transaction = database.transaction(["managerList"],"readonly");
var resource = transaction.objectStore("managerList").openCursor();
var str = "";
var result = document.getElementById("container-2");
resource.onsuccess = function(event) {
//建立游标
var cursor = event.target.result;
//应用游标对数据举行遍历
if(cursor) {
var list = cursor.value;
var str += list.time;
cursor.continue();//继承轮回
} else {//游标轮回究竟以后，打印出str
alert(str);//在这里我们就可以得出list.time的值了
}
};
resource.onerror = function(event) {//涌现毛病给出提醒
alert("can't create database,error:" + resource.error);
};
}查询单条数据
function search(element) {
var description = element.getAttribute("value");
var transaction = database.transaction(["managerList"], "readonly");//只读
var objectStore = transaction.objectStore("managerList");
var request = objectStore.get(description);//应用get()要领找到这条数据
request.onerror = function(event) {
alert("error:：" + request.error);
};
request.onsuccess = function(event) {
var b = request.result;
alert(b.description);//终究获得这条数据的description部份
};
}删除数据
function del() {
var resource = document.getElementById("container-2");
var b = resource.getElementsByTagName("input");
var div = document.getElementById("container-2");
var result = 0;
for(var i = 0;i < b.length;i ++) {
if(b[i].checked == true) {
var time = b[i].value;
var transaction = database.transaction(["managerList"], "readwrite");//读写
var objectStore = transaction.objectStore("managerList");
var request = objectStore.delete(time);//删除数据的中心就是应用delete要领
request.onerror = function (event) {
alert("error：" + request.error);
};
request.onsuccess = function (event) {
alert("delete note success!");
};
}
}
}删除全部数据库
IndexDB只能在控制台内里删除数据，并不能删除数据表及数据库，所以删除只能代码实行
window.indexedDB.deleteDatabase("数据库称号");DEMO演示
Demo地点(涌现bug请移步pc)
pc端偶然会因为代码堆栈的缘由涌现莫名bug，轻易的话能够clone源码
地点在这里：git@git.oschina.net:huangxizhou/indexDB.git
末了祝人人新年快乐！！！
