HTML5WebSQL四种根本操纵的介绍-

?本篇文章给大家带来的内容是对于HTML5WebSQL四种根本操纵的介绍，有一定的参照 价值，有需要的伴侣可以参照 一下，但愿对你有所帮忙。 本篇文章给大家带来的内容是对于HTML5 WebSQL四种根本操纵的介绍，有一定的参照 价值，有需要的伴侣可以参照 一下，但愿对你有所帮忙。

Web SQL数据库API是一个独立的标准，在阅读器层面供给了当地对构造化数据的存储，已经被许多现代阅读器支撑了。

我们通过一个简略的例子来理解下怎样运用Web SQL API在阅读器端新建数据库表共存储数据。

    《script》
    var end;
    function setupDB() {
        return this.createDatabase().then(createTable).then(insertEntry).then(readEntry).then(printResult);
    }
    function createTable() {
        return new Promise(function(resovle, reject) {
            console.log("prepare to create table..." + Date.now());
            this._db.transaction(function(query) {
                query.executeSql('create table if not exists user(id unique, user, passwd)');
            });
            setTimeout(_createTableOK.bind(this, resovle), 1000);
        });
    }
    function _createTableOK(resovle) {
        console.log("table created successfully..." + Date.now());
        resovle();
    }
    function createDatabase() {
        return new Promise(function(resovle, reject) {
           console.log("prepare to create database..." + Date.now());
            this._db = openDatabase('mydb', '1.0', 'JerryTestdb', 1024);
            setTimeout(_createDatabaseOK.bind(this, resovle), 1000);
        });
    }
    function _createDatabaseOK(resovle) {
        console.log("database created successfully..." + Date.now());
        resovle(this._db);
    }
    function insertEntry() {
        return new Promise(function(resolve, reject) {
            this._db.transaction(function(query) {
                query.executeSql("insert into user values (1,'Jerry','1234')");
            });
            setTimeout(_insertEntryOK.bind(this, resolve), 1000);
        });
    }
    function _insertEntryOK(resolve) {
        console.log("entry inserted to table successfully..." + Date.now());
        resolve();
    }
    function readEntry() {
        return new Promise(function(resolve, reject) {
            this._db.transaction(function(query) {
                    query.executeSql('select * from user', [], function(u, results) {
                        setTimeout(_readEntryOK.bind(this, resolve, results), 1000);
                    }); // end of query.executeSql
                } // end of function(query)
           ); // end of this._db.transaction
        });
    }
    function _readEntryOK(resolve, oResult) {
        console.log("entry readed from DB successfully..." + Date.now());
        resolve(oResult);
    }
    function printResult(oResults) {
        for (var i = 0; i < oResults.rows.length; i++) {
            document.writeln('id: ' + oResults.rows[i].id);
            document.writeln('user: ' + oResults.rows[i].user);
            document.writeln('passwd: ' + oResults.rows[i].passwd);
        }
        end = true;
    }
    function work() {
        if (end) {
            clearInterval(handle);
        } else {
            console.log(" working..." + Date.now());
        }
    }
    setupDB();
    var handle = setInterval(work, 200);
    《script》

在阅读器里施行这个利用，会新建一个名叫mydb的数据库，里面一张名为“user”的数据库表，而且插入一笔记录进去，然后从数据库表中读取中来，打印在阅读器上。

setupDB

用promise实现了一个链式调取，第九行代码从语义上来说很容易了解：第一新建数据库(createDatabase)，然后新建数据库表(createTable)，然后插入一笔记录到数据库表里(insertEntry), 然后即将把方才插入表里的记载读出来(readEntry)。最后打印到阅读器上。

大家看我第16行的_createDatabaseOK的函数延时1秒施行，仅仅是为了演示WebSQL API 异步伐用的最好实践。

createDatabase函数的第15行，调取了Web SQL API的openDatabase，新建了一个名为mydb的数据库。openDatabase会返回一个数据库句柄，我们保留在属性_db里以便后续运用。

以上就是HTML5 WebSQL四种根本操纵的介绍的细致内容，更多请关注 百分百源码网 其它相干文章！