客戶端持久化解決方案: Web SQL

客戶端持久化解決方案: Web SQL

Web SQL 提供了一組使用 SQL 操做客戶端數據庫的 APIs, 不是 HTML5 規範的一部分，是一個獨立的規範.

核心方法

• openDatabase： 打開或新建數據庫，返回數據庫對象。
• transaction： 打開一個事務，從而能夠執行提交或者回滾。
• executeSql： 執行實際的 SQL 查詢。

打開/建立數據庫

// window.openDatabase(dbName, version, description, dbSize, [createCallback]);
// 注: 數據庫建立時纔會觸發回調
var db = openDatabase('mydb', '1.0', 'Test DB', 2*1024*1024, function() { console.log('db created..')});

建立數據庫以後，就能夠經過executeSql建立表，進而執行CRUD操做.

建立表

var db = openDatabase(dbName);
db.transaction(function(transaction) {////開啓事務，在回調中執行sql
    transaction.executeSql('CREATE TABLE IF NOT EXISTS user (id unique, name)');
});

插入數據

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, "菜鳥教程")');
   tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "www.runoob.com")');
});

讀取數據

db.transaction(function (tx) {
   tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) {
      var len = results.rows.length, i;
      msg = "<p>查詢記錄條數: " + len + "</p>";
      document.querySelector('#status').innerHTML +=  msg;
    
      for (i = 0; i < len; i++){
         alert(results.rows.item(i).log );
      }
    
   }, null);
});