Web Sql Database，中文翻譯作“本地數據庫”，是隨著HTML5規范加入的在瀏覽器端運行的輕量級數據庫。

在HTML5中，大大豐富了客戶端本地可以存儲的內容，添加了很多功能來將原本必須保存在服務器上的數據轉為保存在客戶端本地，從而大大提高了Web應用程序的性能，減輕了服務器端的負擔，使Web時代重新回到了“客戶端為重，服務器為輕”的時代。 在這其中，一項非常重要的功能就是數據庫的本地存儲功能。在HTML5中內置了一個可以通過SQL語言來訪問的數據庫。在HTML4中，數據庫只能放在服務器端，只能通過服務器來訪問數據庫，但是在HTML5中，可以就像訪問本地文件那樣輕松的對內置的數據庫進行直接訪問。現在，像這種不需要存儲在服務器上的，被稱為“SQLite”的文件型SQL數據庫已經得到了很廣泛的利用，所以HTML5中也采用了這種數據庫來作為本地數據庫。 Html5數據庫它包含三個核心方法： 1.openDatabase：這個方法使用現有數據庫或新建數據庫來創建數據庫對象2.transaction：這個方法允許我們根據情況控制事務提交或回滾3.executeSql：這個方法用于執行SQL 的操作

　　　　executeSql函數有四個參數，其意義分別是：
　　　　　　1）表示查詢的字符串，使用的SQL語言是SQLite 3.6.19。
　　　　　　2）插入到查詢中問號所在處的字符串數據。
　　　　　　3）成功時執行的回調函數。返回兩個參數：fx和執行的結果。
　　　　　　4）一個失敗時執行的回調函數。返回兩個參數：fx和失敗的錯誤信 息

1、打開數據庫或者創建數據庫

//創建數據庫 -有該數據庫就打開，沒有則是新建var database=openDatabase('emp','1.0','員工資料管理',1024*1024,function(){});if(!database){//通過databse 判斷是否創建或則打開成功alert('創建/打開失敗')}else{alert('創建/打開成功')}
openDatabasek中五個參數分別為：數據庫名、版本號、描述、數據庫大小、創建回調。創建回調沒有也可以創建數據庫。

?

2、創建表

function creater_sql(){// - 創建表database.transaction(function(fx){fx.executeSql("create table if not exists stu(s_name TEXT,s_score INT,s_golds INT)",[],function(fx,result){alert('創建成功')},//返回狀態 --成功function(fx,error){alert('創建失敗')}//返回狀態 --失敗 )}); }

3、插入數據

function insert(){// - 插入數據database.transaction(function(fx){fx.executeSql("insert into stu(s_name,s_score,s_golds) values(?,?,?)",[name,sec1,s_gold],// ['李四',1000,1],function(){alert('執行成功')},//返回狀態 --成功function(fx,e){alert('失敗');alert(e)})//返回狀態 --失敗 });}

4、查詢數據

function select(){//查詢數據database.transaction(function(fx){fx.executeSql("select * from stu",[],function(fx,result){alert('查詢成功');for(var i=0;i< result.rows.length;i++){alert(result.rows.item(i).s_name);}},function(fx,e){alert('查詢失敗');})});}

result是查詢到的結果集，其中最重要的屬性—SQLResultSetRowList 類 型的 rows 是數據集的“行” 。
rows 有兩個屬性：length、item 。
length代表總條數，用item(num),可訪問 到具體的行

?

5、刪除

//刪除數據表 dataBase.transaction(function (fx) { fx.executeSql('drop table stu'); });//刪除數據庫 dataBase.transaction(function (fx) { fx.executeSql('drop database stu'); });

?

轉載于:https://www.cnblogs.com/bruce-gou/p/5228242.html

總結

以上是生活随笔為你收集整理的HTML5 Web SQL的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。