IndexedDB 增删改查 简单的库
<!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 增删改查 简单的库的更多相关文章
- js操作indexedDB增删改查示例
js操作indexedDB增删改查示例 if ('indexedDB' in window) { // 如果数据库不存在则创建,如果存在但是version更大,会自动升级不会复制原来的版本 var r ...
- WPF MVVM+EF增删改查 简单示例(二) 1对1 映射
WPF MVVM+EF增删改查 简单示例(一)实现了对学生信息的管理. 现在需求发生变更,在录入学生资料的时候同时需要录入学生的图片信息,并且一名学生只能有一张图片资料.并可对学生的图片资料进行更新. ...
- iOS sqlite 增删改查 简单封装(基于 FMDB)
/** * 对 sqlite 的使用进行简单封装,仅涉及简单的单表 增删改查 * * 基于 FMDB * * 操作基于 model ,数据库表字段与 model 属性一一对应,对 model 整 ...
- 安卓版php服务器的mysql数据库增删改查简单案例
界面: index.php文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- JAVA JDBC 增删改查简单例子
1.数据库配置文件jdbc.properties driver=com.mysql.jdbc.Driver url=jdbc:mysql://localhost:3306/test username= ...
- JDBC增删改查简单测试
首先编写一个entity以便与数据库表文件相对应 lyTable.java public class LyTable implements java.io.Serializable { private ...
- SQL基础语法的单表操作 select|insert|update|delete(增删改查) 简单使用
以下案列以此表举例 1.select(查询) select简单的查询分为两种 注:字段也就是表结构中的列的名称 第一种: select 字段名 from 表名 此种查询只列出你所需要查询的字段, ...
- SQL基础语法select|insert|update|delete(增删改查) 简单使用
以下案列以此表举例 1.select(查询) select简单的查询分为两种 注:字段也就是表结构中的列的名称 第一种: select 字段名 from 表名 此种查询只列出你所需要查询的字段, ...
- indexedDB 增删改查
/** * 打开数据库 */ export function openDB() { return new Promise((resolve, reject) => { let indexedDB ...
随机推荐
- typedef的使用1——引入
#include <stdio.h> #include <string.h> //#define _CRT_SRCURE_NO_WARNING #pragma warning( ...
- Unicode 编码解码
1. Regex.Unescape(str);返回Unicode解码,非Unicode直接返回 /// <summary> /// 2.转为Unicode编码 /// ...
- eclipse在线安装svn插件
原文地址:http://www.cnblogs.com/xdp-gacl/p/4354199.html Eclipse在线安装SVN 一.SVN在线安装 下面为在线安装SVN插件.以下是在线安装步骤: ...
- 关于XML的Schema文件讲解
1 Schema概述 1.1 什么是Schema l Schema是新的XML文档约束:DTD出现的比较早. l Schema要比DTD强大很多: l Schema本身也是XML文档,但Sche ...
- 浅谈用java解析xml文档（三）
接上一篇,本文介绍使用JDOM解析xml文档, 首先我们还是应该知道JDOM从何而来,是Breet Mclaughlin和Jason Hunter两大Java高手的创作成果,2000年初, JDOM作 ...
- jquery图片滑动联播效果
<head> <script src="../Scripts/jquery-1.10.2.js"></script> <meta char ...
- 常用ASP函数的封装
做ASP开发常常需要用到一些小功能,这些功能通常我们都会封装成函数来使用,本教程提供了许多我们经常用到的ASP函数. <% '所有功能函数名如下: ' StrLength(str) 取得字符串长 ...
- python备份脚本
备份制定文件到指定目录下,文件名以当前时间 思路: 1.指定备份的文件或目录 2.指定备份的目标路径 3.压缩备份名是当前日期和时间 4.使用标准的压缩命令 1.最简单的以日期时间为文件名 2.以日期 ...
- C# IO操作（四）大文件拷贝（文件流的使用）、文件编码
大文件拷贝(文件流的使用).文件编码 首先说一下大文件拷贝和文件流,因为计算机的内存资源是有限的,面对几个G甚至更大的文件,需要通过程序来完成拷贝,就需要用到文件流(因为我们无法做到把文件一 ...
- MVC3中 swfupload 按钮不显示 解决方案
这两天在做图片上传并显示的功能,之前就用过swfupload,觉得很不错,之前是用asp.net webform做的,这次的项目是用asp.net MVC3来做,视图引擎用的是Razor. 将js文件 ...