HTML 5 Web SQL操作客户端数据库
HTML 5 Web SQL操作客户端数据库
核心方法 本文将介绍规范中定义的三个核心方法:
1、openDatabase:这个方法使用现有数据库或创建新数据库创建数据库对象。
2、transaction:这个方法允许我们根据情况控制事务提交或回滚。
3、executeSql:这个方法用于执行真实的SQL查询。
打开数据库
openDatabase方法打开一个已经存在的数据库,如果数据库不存在,它还可以创建数据库,创建并打开数据库的语法如下:
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
上面的openDatabase方法使用了下面五个参数:
1、数据库名(mydb)
2、版本号(1.0)
3、描述(Test DB)
4、数据库大小(2*1024*1024)
5、创建回调
最后一个,即第五个参数“创建回调”,在创建数据库时会调用它,但即使没有这个参数,一样可以在运行时创建数据库。
执行查询
执行查询使用database.transaction()函数,它只需要一个参数,下面是一个真实的查询语句:
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); });
上面的查询将会在“mydb”数据库中创建一个LOGS表。
插入操作
为了向表中插入新记录,我们在上面的查询语句中添加了一个简单的SQL查询,修改后的语句如下:
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); 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")'); });
在插入新记录时,我们还可以传递动态值,如:
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); tx.executeSql('INSERT INTO LOGS (id,log) VALUES (?, ?'), [e_id, e_log]; });
这里的e_id和e_log是外部变量,executeSql在数组参数中将每个项目映射到“?”。
读操作
如果要读取已经存在的记录,我们使用一个回调捕获结果,代码如下:
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); 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")'); }); db.transaction(function (tx) { tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) { var len = results.rows.length, i; msg = "
Found rows: " + len + "
"; document.querySelector('#status').innerHTML += msg; for (i = 0; i < len; i++){ alert(results.rows.item(i).log ); } }, null); });
完整的例子
最后,我们在一个完整的HTML 5文档中展现前面讲述的内容,同时使用浏览器来解析这个HTML 5文档。
Log message created and row inserted.
Found rows: 2
foobar
logmsg
原文链接:http://www.tutorialspoint.com/html5/html5_web_sql.htm