HTML5 Web SQL

Posted 2020-06-17

Web Sql Database，中文翻译作“本地数据库”，是随着html5规范加入的在浏览器端运行的轻量级数据库。

在HTML5中，大大丰富了客户端本地可以存储的内容，添加了很多功能来将原本必须保存在服务器上的数据转为保存在客户端本地，从而大大提高了Web应用程序的性能，减轻了服务器端的负担，使Web时代重新回到了“客户端为重，服务器为轻”的时代。

在这其中，一项非常重要的功能就是数据库的本地存储功能。在HTML5中内置了一个可以通过SQL语言来访问的数据库。在HTML4中，数据库只能放在服务器端，只能通过服务器来访问数据库，但是在HTML5中，可以就像访问本地文件那样轻松的对内置的数据库进行直接访问。现在，像这种不需要存储在服务器上的，被称为“SQLite”的文件型SQL数据库已经得到了很广泛的利用，所以HTML5中也采用了这种数据库来作为本地数据库。

 

 

Html5数据库它包含三个核心方法：
1.openDatabase：这个方法使用现有数据库或新建数据库来创建数据库对象

2.transaction：这个方法允许我们根据情况控制事务提交或回滚

3.executeSql：这个方法用于执行SQL 的操作

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

1、打开数据库或者创建数据库

//创建数据库 -有该数据库就打开，没有则是新建
    var database=openDatabase(‘emp‘,‘1.0‘,‘员工资料管理‘,1024*1024,function(){});
　　if(!database){//通过databse 判断是否创建或则打开成功
　　　　alert(‘创建/打开失败‘)
　　}else{
　　　　alert(‘创建/打开成功‘)
　　}
openDatabasek中五个参数分别为：数据库名、版本号、描述、数据库大小、创建回调。创建回调没有也可以创建数据库。

 

2、创建表

function creater_sql(){
        // - 创建表
        database.transaction(function(fx){
            fx.executeSql(
                "create table if not exists stu(s_name TEXT,s_score INT,s_golds INT)",
                [],
                function(fx,result){alert(‘创建成功‘)},//返回状态 --成功
                function(fx,error){alert(‘创建失败‘)}//返回状态 --失败
            )
        });    
    }

3、插入数据

function insert(){
        // - 插入数据
        database.transaction(function(fx){
            fx.executeSql("insert into stu(s_name,s_score,s_golds) values(?,?,?)",
                [name,sec1,s_gold],
    //            [‘李四‘,1000,1],
                function(){alert(‘执行成功‘)},//返回状态 --成功
                function(fx,e){alert(‘失败‘);alert(e)})//返回状态 --失败
        });
    }

4、查询数据

    function select(){//查询数据
        database.transaction(function(fx){
            fx.executeSql("select * from stu",
                [],
                function(fx,result){alert(‘查询成功‘);
                    for(var i=0;i< result.rows.length;i++){
                        alert(result.rows.item(i).s_name);
                    }
                  },
                function(fx,e){alert(‘查询失败‘);})
        });
    }

result是查询到的结果集，其中最重要的属性—SQLResultSetRowList 类 型的 rows 是数据集的“行” 。
rows 有两个属性：length、item 。
length代表总条数，用item(num),可访问 到具体的行

5、删除

    //删除数据表  
    dataBase.transaction(function (fx) {            
        fx.executeSql(‘drop  table  stu‘);        
    });
    //删除数据库  
    dataBase.transaction(function (fx) {            
        fx.executeSql(‘drop  database stu‘);        
    });