核心方法 本文將介紹規範中定義的三個核心方法：

 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