HTML5中Web Sql的學習小結

這篇文章帶給大家的內容是介紹HTML5的Web Sql學習小結，讓大家了解一些Web Sql的相關知識。有一定的參考價值，有需要的朋友可以參考一下，希望對你們有幫助。

在web系統或應用程式中，經常需要在本地儲存一些數據，最早的在客戶端儲存資料用的是cookie(當然cookie主要還是用來保存使用者的狀態，業餘可以乾點保存本地數據的活)，事實它並不適合用於保存客戶端的本地數據，有以下幾個原因：

1、每次請求伺服器的時候都會增加不必要的流量消耗，因為每次請求伺服器是都會講cookie傳送至伺服器。

2、cookie的資料儲存資料的規則，就沒那麼好用，結構也不夠清晰。

3、最重要的一點是cookie的儲存容量極小，每個cookie的長度不能超過4kb，超過時最早儲存cookie的資料會被截斷超出的大小，顯然是不太夠用的。

隨著HTML5的發展，後來又出現了localStorage與sessionStorage：

localStorage：永久存儲，無論多久再次進入頁面或頁面所在網站（可使用clearI或removeItem方法刪除），都能取得儲存的資料。

sessionStorage：暫時存儲，關閉頁面的時候會自動清除已儲存的資料。

事實上在平常工作或開發自己專案的時候，這兩個用的是最多，至少目前這兩個物件還是可以滿足大部分專案本地儲存的需求，雖然儲存結構依然不夠清晰，查詢本地儲存的資料上依然過於簡單。

現在主要是總結一下，HTML5中新增的API-->Web Sql本機資料庫技術，Web Sql資料庫API其實不是HTML5規範的組成部分，它是一個獨立的規範，它可以使用與sql語言基本一致的語法做到本地資料庫的增刪改查，所以有後端開發經驗的開發者很容易上手（需要指出的是，HTML5已經放棄了Web Sql Database資料庫，規範的指定工作已經停止），即便如此，基本上已經得到了大多數瀏覽器的支援。現在我們來介紹一下它的使用：

建立一個WebSql資料庫：

openDatabase(数据库名，数据库版本号，描述，数据库大小，数据库创建成功的回调);
var mydb = openDatabase('myTeatDatabase',1,'this a Web Sql Database',1024*1024,function(){
     //数据库创建成功的回调，可省略
});

註：該方法傳回一個資料庫存取對象，當創建的資料庫已經存在的時候，該方法直接打開這個資料庫。

建立一個交易：

mydb.transaction(function(tx){
　　　　//该方法有一个事务对象参数供使用，该对象上有一系列为数据库增删改查的方法。
});

# 執行一段動作：

tx.executeSql(执行数据库操作的sql语句，参数，数据库操作执行成功的回调，数据库操作执行失败的回调);

具體的資料庫操作：

建立一個資料表：

tx.executeSql('create table if not exists table1 (id unique,name)', [], function(tx, result) { 
	//成功回调
	}，function(error){
         //失败回调
	});

註：這條語句的意思是建立一個資料表table1，當資料表中不存在這張表的時候，如果語句中不加上"if not exists"的話，當想要建立的資料表在資料庫中已經存在的時候會報錯。

刪除一個資料表：

tx.exexcteSql('drop table table1',[],function(tx,result){
      //删除成功时的回调
      }，function(error){ 
         //删除失败时的回调
      });

#在資料表中新增一條資料：

tx.executeSql('insert into table1 (id,name) values (1,'小明')',[],function(tx,result){
            //添加数据成功时的回调
            }，function(error){
                  //添加数据失败时的回调
            });

刪除資料表中的一條或多條資料：

tx.executeSql('delete from table1 where id=1',[],function(tx,result){
//删除成功时的回调
}，function(error){
    //删除失败时的回调
});

或：

tx.executeSql('delete from table1 where id=？',[1],function(tx,result){
//删除成功时的回调
}，function(error){
    //删除失败时的回调
});

更新資料庫表裡面的一條資料：　　　　　　　

tx.executeSql('updata table1 set name="小红" where id=1',[],function(tx,result){
   //数据更新成功时的回调
   }，function(error){
       //数据更新失败时的回调
   });

查詢滿足查詢條件的資料：

　　　　　

tx.executeSql('select * from table',[],function(tx,result){
//查询成功时的回调
}，function(error){
  //查询失败时的回调
});

註：查詢成功的時候可以透過回呼函數中的result參數的rows屬性使用查詢傳回的資料。

這個範例只是最簡單的一種查詢語句，如果有更多複雜查詢的需求的話可以參考sql語句。 總結：

###　　簡單的總結一下，其實這個資料庫API是比較簡單，所有的增刪改查都需要建立一個事務，在交易物件上執行所有操作，目前該API暫時不支援刪除整個資料庫，但我們可以透過刪除該資料庫裡面的所有資料表來清空該資料庫，以達到類似效果。 ###

以上是HTML5中Web Sql的學習小結的詳細內容。更多資訊請關注PHP中文網其他相關文章！