建立及使用 HTML5 SQL Database
HTML5提供了許多的新功能其中一項就是Local端的儲存功能,在Javascript中的函示分別為window.openDatabase及window.localStorage,window.openDatabase相較於Cookie有很大的不同,而window.localStorage比較相近於Cookie是一種key-value的儲存方式。
使用window.openDatabase的方法,這是在Local端建立一個SQL資料庫
var db = window.openDatabase(name, version, display_name, size);
接著就可以下達SQL指令,使用以下的方式
db.transaction(query, error, success);
var query = function(tx) {
var sql = 'doSomething';
var value = [];
tx.executeSql(sql, value, function(tx, result) {
// do something
}, function(tx, error) {
// do something
});
}
var error = function(err) {
// do something
}
var success = function() {
// do something
}
連起來寫就會像是這樣
if(window.openDatabase) {
var db = window.openDatabase('TestDB', '0.1', 'Test local DB', 65535);
db.transaction(
function(tx) {
var createTable = 'CREATE TABLE `test` IF NOT EXISTS'
+ '(`id` INT, `name` TEXT, `age` INT, `sex` TEXT)';
tx.executeSql(createTable);
tx.executeSql('INSERT INTO `test` (`id`, `name`, `age`, `sex`) VALUES(1, 'Tom', 20, 'Male')');
tx.executeSql('INSERT INTO `test` (`id`, `name`, `age`, `sex`) VALUES(2, 'John', 20, 'Male')');
tx.executeSql('INSERT INTO `test` (`id`, `name`, `age`, `sex`) VALUES(3, 'Iris', 20, 'Female')');
var sqlQuery = 'SELECT * FROM `test` WHERE `age`=? AND `sex`=?';
var value = [20, 'Male'];
tx.excuteSql(
sqlQuery, value,
function(tx, rs) {
for(var i = 0;i < rs.rows.length;i++)
alert(rs.rows.item(i).name);
}, function(tx, err) {
// do something
}
);
}, funciton(error) {
// do something
}, function() {
// do something
}
);
}