HTML5本地数据库实例详解

代码如下:

VAR dataBase = openDatabase("student", "1.0", "学生表", 1024 * 1024, function () {
 }
    );
if (!dataBase) {
        alert("数据库创建失败！");
}
 else {
        alert("数据库创建成功！");
}
    

解释一下openDatabase方法打开一个已经存在的数据库，如果数据库不存在，它还可以创建数据库。几个参数意义分别是：
1，数据库名称。
2，版本号 目前为1.0,不管他，写死就OK。
3，对数据库的描述。
4，设置数据的大小。
5，回调函数(可省略)。
初次调用时创建数据库，以后就是建立连接了。
创建的数据库就存在本地，路径如下：
C:\Users\Administrator\AppData\Local\GOOGLE\Chrome\User Data\Default\databases\http_localhost_4987 。
创建的是一个sqllITe数据库，可以用SQLiteSpy打开文件，可以看到里面的数据。SQLiteSpy是一个绿色软件，可以百度一下下载地址或SQLiteSpy官方下载：SQLiteSpy。
第二步：创建数据表

代码如下:

this.createTable=function() {
  dataBase.transaction( function(tx) {
     tx.executeSql(        "create table if not exists stu (id REAL unique, name TEXT)",         [],         function(tx,result){
     alert('创建stu表成功');
 }
,         function(tx, error){
     alert('创建stu表失败:' + error.message);
     }
    );
 }
    );
}
    

解释一下，
executeSql函数有四个参数，其意义分别是：
1）表示查询的字符串，使用的SQL语言是SQLite 3.6.19。
2）插入到查询中问号所在处的字符串数据。
3）成功时执行的回调函数。返回两个参数：tx和执行的结果。
4）一个失败时执行的回调函数。返回两个参数：tx和失败的错误信息。
第三步：执行增删改查
1）添加数据：

代码如下:

this.insert = function () {
  dataBase.transaction(function (tx) {
            tx.executeSql(        "insert  into  stu (id, name) values(?, ?)",        [id, '徐明祥'],        function () {
     alert('添加数据成功');
 }
,        function (tx, error) {
     alert('添加数据失败: ' + error.message);
         }
     );
    }
    );
    

2）查询数据

代码如下:

this.query = function () {
  dataBase.transaction(function (tx) {
            tx.executeSql(        "select  *  From  stu", [],         function (tx, result) {
  //执行成功的回调函数             //在这里对result 做你想要做的事情吧...........            }
,         function (tx, error) {
                alert('查询失败: ' + error.message);
         }
     );
      }
    );
}
    

解释一下
上面代码中执行成功的回调函数有一参数result。

result：查询出来的数据集。其数据类型为 SQLResultSet ，就如同C#中的DataTable。
SQLResultSet 的定义为：

代码如下:

interface  SQLResultSet {
                 readonly  attribute  long  insertId;
                 readonly  attribute  long  rowsAffected;
                 readonly  attribute  SQLResultSetRowList  rows;
             }
    ;
    

其中最重要的属性—SQLResultSetRowList 类型的 rows 是数据集的“行” 。
rows 有两个属性：length、item 。
故，获取查询结果的某一行某一列的值 ：result.rows[i].item[fieldname] 。

3）更新数据

代码如下:

this.update = function (id, name) {
   dataBase.transaction(function (tx) {
            tx.executeSql(        "update  stu  set  name =  ?  where  id= ?",        [name, id],         function (tx, result) {
         }
,        function (tx, error) {
                alert('更新失败: ' + error.message);
        }
    );
   }
    );
}
    

4）删除数据

代码如下:

this.del = function (id) {
     dataBase.transaction(function (tx) {
            tx.executeSql(        "delete  from  stu  where  id= ?",        [id],         function (tx, result) {
         }
,        function (tx, error) {
                alert('删除失败: ' + error.message);
        }
    );
    }
    );
}
    

5）删除数据表

代码如下:

this.dropTable = function () {
    dataBase.transaction(function (tx) {
                tx.executeSql('drop  table  stu');
     }
    );
}
    

【相关推荐】

1. Html5免费视频教程

2. H5制作一个计时器的代码演示

3. H5完成多图片上传的实例详解

4. 详解H5的自定义属性data-*

5. 教你如何实现一个H5微场景

以上就是HTML5本地数据库实例详解的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！