這篇文章帶給大家的內容是介紹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中文網其他相關文章！
