HTML5本地存储——Web SQL Database

基于 HTML5 中的 Web SQL Database 来构建应用程序

前端HTML5几种存储方式的总结

<!DOCTYPE HTML>

<html>

<head>

    <script type="text/javascript">

        var msg;

        // 可以有多个数据库，但无法遍历，

        // 包括空字符串在内的所有字符串都可以作为有效地数据库名称，数据库名称区分大小写，且可以比较。

        // 一个数据库只能有一个版本号

        // 一个显示名字（displayName），

        // 数据库将要保存数据的大小（estimatedSize，以字节为单位 )

        // 一个可选的回调函数（createionCallback，如果数据库没有被创建，这个函数将会被调用 )

        var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);

        // 方法 transaction() 和 readTransaction() 有一个到三个参数，

        // 后两个参数为可选的，分别表示错误回调函数和成功回调函数。

        // transaction() 方法为 read/write 模式，readTransaction() 方法为只读模式；

        db.transaction(function (tx) {

               tx.executeSql('CREATE TABLE IF NOT EXISTS ques (id unique, log)');

               tx.executeSql('INSERT INTO ques (id, log) VALUES (4, "foobar")');

               tx.executeSql('INSERT INTO ques (id, log) VALUES (3, "logmsg")');

               msg = '<p>Log message created and row inserted.</p>';

            document.querySelector('#status').innerHTML =   msg;

        },function(){alert('e');},function(){alert('s');});

        // executeSql这个函数具有四个参数：

        // 表示查询的字符串（sqlStatement）；

        // 插入到查询语句中问号所在处的字符串数据（arguments)；

        // 一个可选的成功时执行函数（callback）；

        // 一个可选的失败时执行函数（errorCallback）。

        // 查询结果是一个对象

        // 插入数据库，insertId 代表这个行号；如果插入多行数据，insertId 代表插入数据的最后一行行号。

        // 改变的行数用 rowsAffected 表示，没有改变 rowsAffected 为 0，“SELECT”语句，rowsAffected 就为 0.

        // rows 为一个 SQLResultSetRowList 对象，代表数据库按顺序返回的行。如果没有返回任何行，则这个对象为空。

        db.transaction(function (tx) {

            tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) {

                var len = results.rows.length, i;

                     msg = "<p>Found rows: " + len + "</p>";

                     document.querySelector('#status').innerHTML +=   msg;

                for (i = 0; i < len; i++){

                       msg = "<p><b>" + results.rows.item(i).log + "</b></p>";

                       document.querySelector('#status').innerHTML +=   msg;

                }

             }, null);

        });

    </script>

</head>

<body>

    <div id="status" name="status">Status Message</div>

</body>

</html>

HTML5 webSQL

Web SQL的更多相关文章

  1. HTML5教程之html 5 本地数据库（Web Sql Database）

    HTML5的Web SQL Databases(html5 本地数据库)的确很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的.今天,我们一起来了解HTM ...

  2. HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  3. HTML5 学习笔记（三）——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  4. web sql database数据存储位置

    Q1: 数据存储在哪儿? Web Storage / Web SQL Database / Indexed Database 的数据都存储在浏览器对应的用户配置文件目录(user profile di ...

  5. 阿伦学习html5 之Web SQL Database

    不知道什么情况, W3C不再维护web SQL Database规范,但是大多浏览器都支持了! Web SQL Database规范页面有着这样的声明 Web SQL Database 规范中定义的三 ...

  6. localStorage, localforage, web sql三者的比较

    最近的项目中用到了前端存储,最初选用的是localStorage,这个是html5里面新增的API,用法很简单.setItem getItem clear. 值得注意的是,localStorage中存 ...

  7. 【HTML5】HTML5本地数据库（Web Sql Database）

    Web Sql数据库简介 Web SQL数据库API实际上不是HTML5规范的组成部分,而是单独的规范.它通过一套API来操纵客户端的数据库. Web SQL数据库的浏览器支持情况 Web SQL 数 ...

  8. Web持久化存储Web SQL、Local Storage、Cookies（常用）

    在浏览器客户端记录一些信息,有三种常用的Web数据持久化存储的方式,分别是Web SQL.Local Storage.Cookies. Web SQL 作为html5本地数据库,可通过一套API来操纵 ...

  9. [转]HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  10. Web SQL Database实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. SSH原理与运用（一）和（二）：远程登录 RSA算法原理（一）和（二）

    SSH原理与运用(一)和(二):远程登录  RSA算法原理(一)和(二) http://www.ruanyifeng.com/blog/2011/12/ssh_remote_login.html ht ...

  2. Linux下设置网卡静态ip

    Linux下设置网卡静态ip 如果是服务器版,没有图形界面只用用命令行修改配置文件 如果是客户端版本,可以用图形界面 配置的前提是要在root用户下才能重启网卡服务 图形界面: system-conf ...

  3. PHP中用下划线开头的变量含义

    http://blog.csdn.net/zlking02/article/details/6752256 一个下划线是私有变量以及私有方法两个下划线是PHP内置变量. https://segment ...

  4. iOS使用代码截图

    /** * 截图代码 * * @param view 需要截图的view * @param rect 需要截取的区域 * * @return 返回截取的对象 */ + (UIImage *)viewS ...

  5. 音乐播放器 AVAudioPlayer、定时器、UISlider

    #import <UIKit/UIKit.h> #import <AVFoundation/AVFoundation.h> @interface ViewController ...

  6. 学习OpenCV——Kmean（C++）

    从前也练习使用过OpenCV的Kmean算法,但是那版本低,而且也是基于C的开发.这两天由于造论文的需要把它重新翻出来在研究一下C++,发现有了些改进 kmeans C++: doublekmeans ...

  7. Lintcode: Majority Number II

    Given an array of integers, the majority number is the number that occurs more than 1/3 of the size ...

  8. hduoj 4708 Rotation Lock Puzzle 2013 ACM/ICPC Asia Regional Online —— Warmup

    http://acm.hdu.edu.cn/showproblem.php?pid=4708 Rotation Lock Puzzle Time Limit: 2000/1000 MS (Java/O ...

  9. 每天一个shell知识--数组

    1.shell中数组的定义: 数组名=(value value1 value2 ) 也可以单独的设定数组的分量: arrayL[0]=value arrayL[1]=value1 2.${arrayL ...

  10. 使用javabeen的好处

    什么是javabeen? javaBean在MVC设计模型中是model,又称模型层, 在一般的程序中,我们称它为数据层, 就是用来设置数据的属性和一些行为,然后提供获取属性和设置属性的get/set ...