Web Sql database 本地数据库

/*
 ** 介绍Web Sql Database使用
 */
//web sql database 数据库入口
function WebDatabase() {};
(function() {
    /**
     *@decription 如果数据库不存在,则创建
     *@param {String} 数据库名称
     *@param {String} 版本号
     *@param {String} 数据库描述
     *@param {Number} 数据库大小
     *@param {Function} 回调函数
     */
    var currentDb;

    return WebDatabase.prototype = {
        getCurrentDb: getCurrentDb,
        openDb: openDb,
        createTable: createTable,
        insert: insert,
        query: query,
        update: update,
        deleteItem: deleteItem,
        dropTable: dropTable,
        manualTransaction: manualTransaction
    }
    /**
     * @param  {Object}
     * name {String} 数据库名称
     * version {String} 数据库版本号
     * desc {String} 数据库的描述
     * capacity {Number} 数据库容量
     * callback {Function} 创建或者打开数据库成功的回调
     * @return {Object} 创建或者打开的数据库对象
     */
    function openDb(options) {
        var defaultOptions = {
                name: ‘‘,
                version: ‘1.0‘,
                desc: ‘‘,
                capacity: 1024 * 1024,
                callback: function() {}
            },
            optionsValue;
        options = merge(options, defaultOptions);
        optionsValue = getValues(options);
        currentDb = openDatabase.apply(null, optionsValue);
        return currentDb;
    }
    /**
     *@param {String} 创建的sql语句
     *@param {Array} 插入到查询中问号所在处的字符串数据
     *@param {Function} 成功的回调函数
     *@param {Function} 失败的回调函数
     */
    // function executeSql(sql, [], success, fail){
    	//数据表操作
    // }

    function matchSql(sql, tableName) {
        var reg = /\{\{(\w+)\}\}$/;
        sql = sql.replace(reg, function(match, set) {
            return tableName;
        });
        return sql;
    }
    /**
    * @description 创建数据表
    * @param {String} tableName 要创建的数据表名称
    * @param {Object} options 描述字段
    * @param {Function} success 成功的回调
    * @param {Function} fail 执行失败的回调
    * @return {Undefined} 不返回结果
    * @example
    * createTable(‘student‘,{id:‘INTEGER UNIQUE PRIMARY KEY‘,name:‘TEXT‘})
    * -----------------------
    * id        | name
    * -----------------------
     */
    function createTable(tableName, options, success, fail) {
        var sql = ‘create table if not exists ‘ + tableName + ‘ (‘ + mergeArrToStr(options, ‘ ‘) + ‘)‘,
            success = success || function() {
                alert(‘success to create a table ‘ + tableName);
            },
            fail = fail || function() {
                alert(‘fail to create a table ‘ + tableName)
            };
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, [], success, fail);
        });
    }
    /**
     * @param {String} tableName 要创建的数据表名称
     * @param  {Object} data 插入的数据字段
     * @param {Function} success 成功的回调
     * @param {Function} fail 执行失败的回调
     * @return {Undefined} 无返回结果
     * @example
     * insert(‘student‘,{id:1,name:‘author‘})
     * -----------------------
     * id        | name
     * 1		 | author
     * -----------------------
     */
    function insert(tableName, data, success, fail) {
        var keys = getKeys(data).join(),
            values = getValues(data),
            qMark = values.map(function() {
                return ‘?‘;
            }),
            sql = ‘insert into ‘ + tableName + ‘ (‘ + keys + ") values(" + qMark.join() + ")",
            success = success || function() {
                alert(‘success to insert a item to ‘ + tableName)
            },
            fail = fail || function() {
                alert(‘fail to insert a item to ‘ + tableName)
            };
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, values, success, fail);
        });
    }
    /**
     * @param {String} tableName 要创建的数据表名称
     * @param  {Array} options 要查询的字段
     * @param {Function} success 成功的回调
     * @param {Function} fail 执行失败的回调
     * @return {Undefined} 无返回结果
     * @example
     * query(‘student‘,‘id‘)
     * -----------
     * id
     * 1
     * -----------
     */
    function query(tableName, options, success, fail) {
    	Array.isArray(options) ? ‘‘ : options=[options];
        var keys = options ? options.join() : ‘*‘,
            sql = ‘select ‘ + keys + ‘from ‘ + tableName,
            success = success || function(tx, resultSet) {
                alert(‘success to query in ‘ + tableName);
                var resultLen = resultSet.rows.length,
                    i = 0,
                    result = [];
                for (; i < resultLen; i++) {
                    result.push(resultSet.rows.item(i));
                }
                console.log(result);
            },
            fail = fail || function() {
                alert(‘fail to query in ‘ + tableName);
            };
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, [], success, fail);
        });
    }
    /**
     * @param {String} tableName 要创建的数据表名称
     * @param  {Object} options 要更新的字段以及对应的值
     * @param  {Object} 要更新的查找字段[单条数据]
     * @param {Function} success 成功的回调
     * @param {Function} fail 执行失败的回调
     * @return {Undefined} 无返回结果
     * @example
     * update(‘student‘,{name:‘AUTHOR‘},{name:‘id‘,value:1})
     * -----------------------
     * id        | name
     * 1		 | AUTHOR
     * -----------------------
     */
    function update(tableName, options, where, success, fail) {
        var updateStr, fail, success, sql, keys, values, qMark;
        fail = fail || function() {
                alert(‘fail to update the ‘ + tableName);
            },
            success = success || function() {
                alert(‘success to update the ‘ + tableName);
                console.log(arguments);
            },
            keys = getKeys(options);
        values = getValues(options);
        qMark = keys.map(function() {
            return ‘?‘;
        });
        options = {};
        keys.forEach(function(key, index) {
            options[key] = qMark[index];
        });
        values.push(where.value);
        updateStr = mergeArrToStr(options, ‘=‘),
            sql = ‘update ‘ + tableName + ‘ set ‘ + updateStr + ‘ where ‘ + where.name + ‘= ? ‘;
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, values, success, fail);
        });
    }
    /**
     * @param {String} tableName 要创建的数据表名称
     * @param  {Object} 要删除的查找字段[单条数据]
     * @param {Function} success 成功的回调
     * @param {Function} fail 执行失败的回调
     * @return {Undefined} 无返回结果
     * @example
     * deleteItem(‘student‘,{name:‘id‘,value:1})
     * -----------------------
     * id        | name
     * -----------------------
     */
    function deleteItem(tableName, where, success, fail) {
        var sql = ‘delete from ‘ + tableName + ‘ where ‘ + where.name + ‘= ?‘,
            success = success || function(tx, resultSet) {
                alert(‘success to delete a item in ‘ + tableName);
                var len = resultSet.rows.length,
                    i = 0,
                    result = [];
                for (; i < len; i++) {
                    result.push(resultSet.rows.item(i));
                }
                console.log(resultSet.rowsAffected);
            },
            fail = fail || function() {
                alert(‘fail to delete a item in ‘ + tableName)
            };
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, [where.value], success, fail);
        });
    }
    /**
     * @param  {String} tableName 要删除的数据表名称
     * @param  {Function} 删除成功的回调
     * @param  {Function} 删除失败后的回调
     * @return {Undefined} 无返回结果
     * @example
     * dropTable(‘student‘)
     * -------------------
     * -------------------
     */
    function dropTable(tableName, success, fail) {
        var sql = ‘drop table ‘ + tableName,
            success = success || function() {
                console.log(‘dropTable:‘, arguments);
            },
            fail = fail || function() {};
        sql = matchSql(sql, tableName);
        console.log(sql);
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, [], success, fail);
        });
    }
    /**
     * @description 自己手动执行的sql
     * @param  {String} sql语句
     * @param  {Array||String} 需要的数据
     * @param  {Function} 成功执行后的回调
     * @param  {Function} 执行失败的回调
     * @return {Undefined} 无返回结果
     * @example
     * var sql = ‘create table if not exists student (id INTEGER NOT NULL PRIMARY KEY,name TEXT)‘;
	 * manualTransaction(sql);
	 * -----------------------
	 * id 		   | name
	 * -----------------------
     */
    function manualTransaction(sql, values, success, fail) {
        values = Array.isArray(values) ? values : [values];
        currentDb.transaction(function(tx) {
            tx.executeSql(sql, values, success, fail);
        });
    }
    /**
     * @return {Object} 当前的活动数据库
     */
    function getCurrentDb() {
        return currentDb;
    }

    function merge(target, source) {
        var result = {};
        for (var i in source) {
            if (source.hasOwnProperty(i)) {
                result[i] = target[i] || source[i];
            }
        }
        return result;
    }

    function getValues(obj) {
        var keys = getKeys(obj),
            length = keys.length,
            values = [];
        for (var i = 0; i < length; i++) {
            values[i] = obj[keys[i]];
        }
        return values;
    }

    function getKeys(obj) {
        if (typeof obj !== ‘object‘) return [];
        return Object.keys(obj);
    }

    function mergeArrToStr(options, connector) {
        var keys = getKeys(options),
            values = getValues(options),
            updateStr;
        updateStr = keys.map(function(value, index) {
            return value + connector + values[index];
        });
        return updateStr.join();
    }
})();

  使用本地的数据库管理系统实现数据的管理:

使用方法:

var localDb = new WebDatabase();
localDb.openDb();

  

时间: 2024-08-01 10:46:28

Web Sql database 本地数据库的相关文章

HTML5教程之html 5 本地数据库(Web Sql Database)

HTML5的Web SQL Databases(html5 本地数据库)的确很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的.今天,我们一起来了解HTML 5的Web SQL Database API:openDatabase.transaction.executeSql. Web SQL数据库API实际上不是HTML5规范的组成部分,而是单独的规范.它通过一套API来操纵客户端的数据库.Safari.Chrome.Firefox.Opera等主流

html 5 本地数据库(Web Sql Database)核心方法

Web SQL数据库API实际上不是HTML5规范的组成部分,而是单独的规范.它通过一套API来操纵客户端的数据库.Safari.Chrome.Firefox.Opera等主流浏览器都已经支持Web SQL Database.HTML5的Web SQL Databases的确很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的.今天,我们一起来了解HTML 5的Web SQL Database API. 下面将一一将介绍怎样创建打开数据库,创建表,添加

html 5 本地数据库-- Web Sql Database核心方法openDatabase、transaction、executeSql 详解

Web SQL数据库API实际上不是HTML5规范的组成部分,而是单独的规范.它通过一套API来操纵客户端的数据库.Safari.Chrome.Firefox.Opera等主流浏览器都已经支持Web SQL Database.HTML5的Web SQL Databases的确很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的.今天,我们一起来了解HTML 5的Web SQL Database API. 下面将一一将介绍怎样创建打开数据库,创建表,添加

HTML5本地存储——Web SQL Database

在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就无能为力了,灵活大不够强大. Web SQL Database 我们经常在数据库中处理大量结构化数据,html5引入Web SQL Database概念,它使用 SQL 来操纵客户端数据库的 API,这些 API 是异步的,规范中使用的方言是SQLlite,悲剧正是产生于此,Web SQL Data

(转)HTML5开发学习(3):本地存储之Web Sql Database

原文:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html HTML5开发学习(3):本地存储之Web Sql Database(附源码) Posted on 2012-03-25 14:03 祥叔 阅读(0) 评论(0)  编辑 收藏 接着上一篇,这节介绍Html5 本地存储中的一个很重要的概念--Web Sql Database ,正因为本人觉得这个很重要,所有独立出来重点介绍.即时你完全没听说过这个概念,望文生

Web SQL Database 的基本用法

这两天了解了下 Web SQL Datebase,觉得有必要mark一下,虽然目前它已暂停研发,但相信在以后会有很棒的发展.在此仅mark下它的基本用法,以备后用! Web Sql Database,中文翻译作“本地数据库”,是随着HTML5规范加入的在浏览器端运行的轻量级数据库.例如购物网站的购物车,对于简单的键值对或简单对象进行存储,但是无法应对繁琐的关系数据进行处理. Web SQL Database 规范中定义的三个核心方法:   1.openDatabase:这个方法使用现有数据库或新

阿伦学习html5 之Web SQL Database

不知道什么情况, W3C不再维护web SQL Database规范,但是大多浏览器都支持了! Web SQL Database规范页面有着这样的声明 Web SQL Database 规范中定义的三个核心方法: openDatabase:这个方法使用现有数据库或新建数据库来创建数据库对象 transaction:这个方法允许我们根据情况控制事务提交或回滚 executeSql:这个方法用于执行SQL 查询 openDatabase: 我们可以使用这样简单的一条语句,创建或打开一个本地的数据库对

《Javascript权威指南》学习笔记之十八:BOM新成就(1)--客户端存储数据(Web SQL DataBase实现)

使用本地存储和会话存储可以实现简单的对象持久化,可以对简单的键值对或对象进行存储.但是,对于比较复杂的关系数据进行处理时,就要用Web SQL Database.浏览器对Web SQL Database的支持情况如图: 一.如何使用Web SQL Database <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-t

前端存储之Web Sql Database

前言 在上一篇前端存储之indexedDB中说到,我们项目组要搞一个前后端分离的项目,要求在前端实现存储,我们首先找到了indexedDB,而我们研究了一段时间的indexedDB后,发现它并不是很适合我们的项目,原因文章后面会讲到,所以我们就继续找,于是我们就找到了Web Sql Database,发现这个前端数据库是比较适合我们的项目的,于是果断转投Web Sql Database的怀抱,找存储工具跟穿鞋一个道理,不在乎多炫酷,合适才是王道,要是因为不合适导致磨脚是走不长远的,既然找到了合适