Web SQL

作者: qhaobaba | 来源:发表于2017-07-26 21:20 被阅读0次

Html5数据库API是以一个独立规范形式出现,它包含三个核心方法:

1、openDatabase:这个方法使用现有数据库或创建新数据库创建数据库对象。

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

3、executeSql:这个方法用于执行真实的SQL查询。

打开数据库

openDatabase方法可以打开已经存在的数据库,不存在则创建:

var db = openDatabase('mydatabase', '2.0', my db', 2 * 1024);

openDatabasek中五个参数分别为:数据库名、版本号、描述、数据库大小、创建回调。创建回调没有也可以创建数据库。

执行查询

database.transaction()函数用来查询,下面将在mydatabase数据库中创建表t1:

   var db = openDatabase(' mydatabase ', '1.0', 'Test DB', 2 * 1024 * 1024);  
   db.transaction(function (tx) {    
      tx.executeSql('CREATE TABLE IF NOT EXISTS t1 (id unique, log)');  
   });

插入操作

var db = openDatabase('mydatabase', '2.0', my db', 2 * 1024);

   db.transaction(function (tx) { 
      tx.executeSql('CREATE TABLE IF NOT EXISTS t1 (id unique, log)');  
      tx.executeSql('INSERT INTO t1 (id, log) VALUES (1, "foobar")');  
      tx.executeSql('INSERT INTO t1 (id, log) VALUES (2, "logmsg")');  
   });

在插入新记录时,我们还可以传递动态值,如:

   var db = openDatabase(' mydatabase ', '2.0', 'my db', 2 * 1024);  
   db.transaction(function (tx) {    
     tx.executeSql('CREATE TABLE IF NOT EXISTS t1 (id unique, log)');  
     tx.executeSql('INSERT INTO t1    (id,log) VALUES (?, ?'), [e_id, e_log]; 
     //e_id和e_log是外部变量
   });

读操作

如果要读取已经存在的记录,我们使用一个回调捕获结果,代码如下:

   var db = openDatabase(mydatabase, '2.0', 'my db', 2*1024);     
db.transaction(function (tx) { 
      tx.executeSql('CREATE TABLE IF NOT EXISTS t1 (id unique, log)');  
  tx.executeSql('INSERT INTO t1 (id, log) VALUES (1, "foobar")');  
  tx.executeSql('INSERT INTO t1 (id, log) VALUES (2, "logmsg")');  

});
db.transaction(function (tx) {
tx.executeSql('SELECT * FROM t1, [], 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++){
alert(results.rows.item(i).log );
}
}, null);
});

完整的例子

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
var msg;
db.transaction(function (tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)');
tx.executeSql('INSERT INTO LOGS (id, log) VALUES (1, "foobar")');
tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "logmsg")');
msg = '<p>Log message created and row inserted.</p>';
document.querySelector('#status').innerHTML = msg;
});

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>

下面是在最新版本的Safari或Opera浏览器中产生的输出结果。

Log message created and row inserted.
Found rows: 2
foobar
logmsg

相关文章

  • webSQL

    HTML5 Web 存储 HTML5 应用程序缓存HTML5 Web SQL 数据库Web SQL 数据库 API...

  • H5的离线存储方案

    1. Web SQL Database HTML5的存储还有一种Web SQL Database方式,虽然还有浏览...

  • 前端安全

    web安全性测试 SQL注入 所谓SQL注入,就是通过把SQL命令插入到 Web表单提交 或输入域名或页面请求的查...

  • WEB sql database

    WEB SQL Database 介绍: web sql database 是一个独立于w3c规范之外的标准,但...

  • IndexedDB(一:基本使用)

    在HTML5本地存储——Web SQL Database提到过Web SQL Database实际上已经被废弃,而...

  • 谈谈sql注入之原理和防护(-)

    谈谈sql注入(二)谈谈sql注入(三)谈谈sql注入(四)所谓SQL注入,就是通过把SQL命令插入到Web表单提...

  • Web SQL

    Html5数据库API是以一个独立规范形式出现,它包含三个核心方法: 1、openDatabase:这个方法使用现...

  • web防火墙的原理和技术分析

    Web应用防火墙主要是对web特有入侵方式的加强防护,重点是放SQL注入,也有人称为SQL防火墙。 Web防火墙的...

  • 2020-07-29

    安全渗透测试-sql注入 总目标: 1、sql注入介绍 2、web安全渗透测试分类 3、sql注入原理 4、sql...

  • ES6(六)用Class + Promise封装一下Web SQ

    Web SQL 首先呢,HTML5已经放弃了 Web SQL,这里做这个封装,主要是为了练手,另外是为了做在线演示...

网友评论

      本文标题:Web SQL

      本文链接:https://www.haomeiwen.com/subject/ltxokxtx.html