<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="IndexedDb.js"></script>
<script> //初始化数据库 //1.新建数据库
//2.新建表
//3.创建数据表对应的Data Model var dbInfo = []; //新建数据库的信息
var dbversion = 2;
var dbname = 'newdb'; var tables = {//表名字的枚举值
cost: 'Cost',
user: 'User',
catgory: 'Catgory' } var costTable = {//消费表
name: tables.cost, //表名字
fields: ['catgory', 'cost', 'date', 'description'],//字段
index: [//索引
{key: 'date', unique: true} //索引键名,是否唯一
]
}
var catgoryTable = {//类别表
name: tables.catgory,
fields: ['catgory'],
index: [//索引
{key: 'catgory', unique: true}
] }
var userTable = {//用户表
name: tables.user,
fields: ['phone', 'pwd', 'uid', 'uname'],
index: [//索引
{key: 'uid', unique: true},
{key: 'uname', unique: true}
]
} dbInfo.push(costTable);
dbInfo.push(catgoryTable);
dbInfo.push(userTable); Index.create(dbname, dbInfo, null, null, dbversion); //初始化数据库完毕 //Data Model 的 增删改查方法
window.onload = function () {
//实例化一个对象
var user = new User({uname: 'joe0.453569732606411'}); //添加一条数据
user.add({}, function (data) {
if (data == 'complete') {
console.log('add success;');
//do something you want
}
}); //更新一条数据
user.update({uid: 123}, function (data) {
if (data == 'success') {
console.log('update success;');
//do something you want
}
else {
//not find this item to uopdate
} }); //获取数据表的所有数据
user.get(function (data) {
console.log('get success');
data.forEach(function (item) {
var div = document.createElement('div');
div.innerText = item.uname + ':' + item.uid;
document.body.appendChild(div);
})
}); //删除一条数据
user.delete(function (data) {
if (data == 'success') {
console.log('delete success;');
//do something you want
} else {
//not get this item to delete
}
}) } </script>
</head>
<body>
</body>
</html>

下面是IndexedDb.js

/**
* Created by 宇乔 on 13-11-12.
*/ (function (window) {
var A = {
create: function (dbname, dbInfo, successFn, errorFn, version) { var me = this;
this.dbName = dbname;
this.version = version;
for (var i = 0, len = dbInfo.length; i < len; i++) {
me.generateModel(dbInfo[i]);
}
this.open(dbname, version,
function success(request) {
if (me.isFunction(successFn)) {
successFn.call(this, request);
}
},
function error() {
if (me.isFunction(errorFn)) {
errorFn.call(this);
}
},
function update(event) {
for (var i = 0, len = dbInfo.length; i < len; i++) {
var info = dbInfo[i];
var objectStore = event.currentTarget.result.createObjectStore(info.name,
{ keyPath: "id", autoIncrement: true });
for (var j = 0, l = info.index.length; j < l; j++) {
objectStore.createIndex(info.index[j].key || 'null', info.index[j].key || 'null', { unique: info.index[j].unique || false });
} } }, dbInfo); }, open: function (dbname, version, success, error, update, dbInfo) {
var me = this;
window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
if (!window.indexedDB) {
error.call(null);
return;
}
var req = window.indexedDB.open(dbname, version); req.onerror = function (event) {
if (me.isFunction(error)) {
error.call(this, event);
}
};
req.onsuccess = function (event) { if (me.isFunction(success)) {
success.call(this, req, event);
}
};
req.onupgradeneeded = function (event) {
if (me.isFunction(update)) { update.call(this, event);
}
};
},
getIndexFields: function (index) {
var indexfiled = [];
index.forEach(function (item) {
indexfiled.push(item['key']);
});
return indexfiled;
},
getIndex: function () { var fields = [];
var result = {};
var indexs = this.indexFields;
var that = this;
for (var i in this) {
if (this.hasOwnProperty(i)) {
if (this[i] != 'undefined') {
fields.push(i);
}
}
}
fields.forEach(function (item) {
if (indexs.indexOf(item) != -1) {
result['key'] = item;
result['value'] = that[item];
}
}); return result;
},
generateModel: function (info) {
var fName = info.name;
var fields = info.fields;
var me = this;
var cons = '';
var method = ''; fields.forEach(function (item) {
cons += 'this.' + item + '=data.' + item + ';';
}) var index = me.getIndexFields(info.index); cons += fName + '.prototype.version=' + this.version + ';' + fName + '.prototype.dbName="' + this.dbName + '";' + fName + '.prototype.tbName="' + fName + '";' + fName + '.prototype.indexFields="' + index + '";' + fName + '.prototype.fields="' + fields + '";';
var add = fName + '.prototype.add=' + function (data, fn) {
var that = this;
me.open(me.dbName,
me.version,
function success(req) {
var db = req.result;
var transaction = db.transaction(that.__proto__.tbName, "readwrite");
var itemStore = transaction.objectStore(that.__proto__.tbName);
var sourceData = that.getSourceData();
if (sourceData) {
data = sourceData
}
var request = itemStore.add(data);
request.onsuccess = function (evt) {
};
transaction.oncomplete = function (event) {
if (me.isFunction(fn)) {
fn(event.type);
db.close()
}
};
transaction.onerror = function (event) {
if (me.isFunction(fn)) {
fn(event);
db.close()
}
};
}
);
}; var getSourceData = fName + '.prototype.getSourceData=' + function () {
var me = this;
var obj = {};
var keys = Object.keys(this);
keys.forEach(function (item) {
if (me.hasOwnProperty(item)) {
obj[item] = me[item]
}
}
);
return obj;
}; var del = fName + '.prototype.delete=' + function (fn) {
var that = this;
me.open(me.dbName,
me.version,
function success(req) {
var db = req.result;
var transaction = req.result.transaction(that.__proto__.tbName, "readwrite");
var itemStore = transaction.objectStore(that.__proto__.tbName);
var getSearchData = me.getIndex.call(that);
var getData = itemStore.index(getSearchData.key).get(getSearchData.value);
getData.onsuccess = function (data) {
if (data.target.result) {
var deleteFn = itemStore.delete(data.target.result.id);
deleteFn.onsuccess = function (e) {
if (me.isFunction(fn)) {
fn(e.type);
db.close();
}
};
deleteFn.onerror = function (evt) {
if (me.isFunction(fn)) {
fn(evt);
db.close();
}
}
} else {
if (me.isFunction(fn)) {
fn("not find item to delete");
db.close();
}
}
};
getData.onerror = function (e) {
if (me.isFunction(fn)) {
fn(e);
db.close();
}
}
}
);
};
var update = fName + '.prototype.update=' + function (newData, fn) {
var that = this;
me.open(me.dbName,
me.version,
function success(req) {
var db = req.result;
var transaction = db.transaction(that.__proto__.tbName, "readwrite");
var getSearchData = me.getIndex.call(that);
var store = transaction.objectStore(that.__proto__.tbName),
itemStore = store.index(getSearchData.key).get(getSearchData.value);
itemStore.onsuccess = function (evt) {
if (evt.target.result) {
var model = evt.target.result;
for (var i in newData) {
model[i] = newData[i];
}
store.put(model);
if (me.isFunction(fn)) {
fn(evt.type);
}
db.close();
} else {
if (me.isFunction(fn)) {
fn("not find this item");
db.close();
}
}
;
itemStore.onerror = function (evt) {
if (me.isFunction(fn)) {
fn(evt);
}
db.close();
}
}
}
);
}; var get = fName + '.prototype.get=' + function (fn) {
var that = this;
me.open(me.dbName,
me.version,
function success(req) {
var db = req.result;
var transaction = req.result.transaction(that.__proto__.tbName, "readwrite");
var itemStore = transaction.objectStore(that.__proto__.tbName);
var cur = itemStore.openCursor(IDBKeyRange.lowerBound(0));
var dataList = [];
cur.onsuccess = function (evt) {
var cursor = evt.target.result;
if (cursor) {
dataList.push(cursor.value);
cursor.continue();
}
else {
if (me.isFunction(fn)) {
fn(dataList);
db.close();
}
}
};
cur.onerror = function () {
if (me.isFunction(fn)) {
fn("not get this item");
db.close();
}
}
}
);
}; eval(fName + " = function (data) {" + cons + "}");
eval(add);
eval(getSourceData);
eval(get);
eval(update);
eval(del); },
isFunction: function (o) {
return o && Object.prototype.toString.call(o) == '[object Function]';
},
isObject: function (o) {
return o && Object.prototype.toString.call(o) == '[object Object]';
} };
window['Index'] = A;
}(window))

  

IndexedDB 增删改查 简单的库的更多相关文章

  1. js操作indexedDB增删改查示例

    js操作indexedDB增删改查示例 if ('indexedDB' in window) { // 如果数据库不存在则创建,如果存在但是version更大,会自动升级不会复制原来的版本 var r ...

  2. WPF MVVM+EF增删改查 简单示例(二) 1对1 映射

    WPF MVVM+EF增删改查 简单示例(一)实现了对学生信息的管理. 现在需求发生变更,在录入学生资料的时候同时需要录入学生的图片信息,并且一名学生只能有一张图片资料.并可对学生的图片资料进行更新. ...

  3. iOS sqlite 增删改查 简单封装(基于 FMDB)

    /** *  对 sqlite 的使用进行简单封装,仅涉及简单的单表 增删改查 * *  基于 FMDB * *  操作基于 model ,数据库表字段与 model 属性一一对应,对 model 整 ...

  4. 安卓版php服务器的mysql数据库增删改查简单案例

    界面: index.php文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  5. JAVA JDBC 增删改查简单例子

    1.数据库配置文件jdbc.properties driver=com.mysql.jdbc.Driver url=jdbc:mysql://localhost:3306/test username= ...

  6. JDBC增删改查简单测试

    首先编写一个entity以便与数据库表文件相对应 lyTable.java public class LyTable implements java.io.Serializable { private ...

  7. SQL基础语法的单表操作 select|insert|update|delete(增删改查) 简单使用

    以下案列以此表举例 1.select(查询) select简单的查询分为两种 注:字段也就是表结构中的列的名称 第一种: select  字段名  from  表名 此种查询只列出你所需要查询的字段, ...

  8. SQL基础语法select|insert|update|delete(增删改查) 简单使用

    以下案列以此表举例 1.select(查询) select简单的查询分为两种 注:字段也就是表结构中的列的名称 第一种: select  字段名  from  表名 此种查询只列出你所需要查询的字段, ...

  9. indexedDB 增删改查

    /** * 打开数据库 */ export function openDB() { return new Promise((resolve, reject) => { let indexedDB ...

随机推荐

  1. Android(java)学习笔记131:Intent启动别的Activity

    1.案例 (1)首先是main.xml和other.xml文件如下: main.xml文件: <?xml version="1.0" encoding="utf-8 ...

  2. uiautomator日志文件转换为xml格式文件

    如果想把uiautomator的日志文件,转换成漂亮的xml文件,那么可以使用automator-log-converter.jar工具, 工具使用方法: 使用工具automator-log-conv ...

  3. 20160509-hibernate-集合映射

    集合映射 集合映射(set, list, array,bag, map) <set name=”employees” > <key column=”depart_id”/> & ...

  4. VS2015+AngularJS+Ionic开发

    安装VS2015 Update2的过程是非常曲折的.还好经过不懈的努力,终于折腾成功了. 如果开发Cordova项目的话,推荐大家用一下ionic这个框架,效果还不错.对于Cordova.PhoneG ...

  5. kettle Argument, Parameter, Variable

    1. Argument, Parameter, Variable 的区别 a.Argument作为位置参数不能复用,而其他2个可以根据名称重复使用 b. Argument, Parameter作用域局 ...

  6. Ext.Net学习笔记22:Ext.Net Tree 用法详解

    Ext.Net学习笔记22:Ext.Net Tree 用法详解 上面的图片是一个简单的树,使用Ext.Net来创建这样的树结构非常简单,代码如下: <ext:TreePanel runat=&q ...

  7. 12天学好C语言——记录我的C语言学习之路(Day 3)

    12天学好C语言--记录我的C语言学习之路 Day 3: 不知不觉到了第三天的学习,我们前两天学习的东西很杂乱,各个方面都有学习.我觉得这不是不系统,也不是学的不扎实,这种学习对于初学者而言我认为是很 ...

  8. .Net 程序集 签名工具sn.exe 密钥对SNK文件 最基本的用法

    阐述签名工具这个概念之前,我先说说它不是什么: 1.它不是用于给程序集加密的工具,它与阻止Reflector或ILSpy对程序集进行反编译一毛钱关系都没有. 2.它很讨厌人们把它和加密联系在一起. 我 ...

  9. Java实现HTML代码生成PDF文档

    1.IText实现html2pdf,速度快,纠错能力差,支持中文(要求HTML使用unicode编码),但中支持一种中文字体,开源. 2.Flying Sauser实现html2pdf,纠错能力差,支 ...

  10. tomcat错误信息解决方案【严重:StandardServer.await: create[8005]

    1.独立运行的tomcat.exe没有关闭,关闭tomcat图标并结束掉tomcat进程.(我是这个原因,在开始菜单里找到tomcat,然后stop它) 2.安装了其他的软件占用了8080端口,tom ...