日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > HTML >内容正文

HTML

(九)HTML5本地存储——本地数据库SQLLite的使用

發(fā)布時間:2024/4/14 HTML 40 豆豆
生活随笔 收集整理的這篇文章主要介紹了 (九)HTML5本地存储——本地数据库SQLLite的使用 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
在HTML5中,大大豐富了客戶端本地可以存儲的內(nèi)容,添加了很多功能將原本必須要保存在服務(wù)器上的數(shù)據(jù)轉(zhuǎn)為保存在客戶端本地,從而大大提高了web應(yīng)用程序額的性能,減輕了服務(wù)器端的負擔(dān),使web時代重新回到了“客戶端為重,服務(wù)器端為輕”的時代。

?? 在這其中,一項非常重要的功能就是對于數(shù)據(jù)庫的本地存儲功能。在HTML4中,數(shù)據(jù)庫只能放在服務(wù)器端,只能通過服務(wù)器來訪問數(shù)據(jù)庫,但是在HTML5中,可以像訪問本地文件那樣輕松的對內(nèi)置數(shù)據(jù)庫進行直接訪問。在HTML5中內(nèi)置了兩種本地數(shù)據(jù)庫:SQLLite,可以通過SQL語言來訪問的文件型SQL數(shù)據(jù)庫;indexedDB,NoSQL類型的數(shù)據(jù)庫

?? Web SQL數(shù)據(jù)庫API實際上不是HTML5規(guī)范的組成部分,而是單獨的規(guī)范。它通過一套API來操縱客戶端的數(shù)據(jù)庫。Safari、Chrome、Firefox、Opera等主流瀏覽器都已經(jīng)支持Web SQL Database。HTML5的Web SQL Databases的確很誘惑人,當(dāng)你發(fā)現(xiàn)可以用與mysql查詢一樣的查詢語句來操作本地數(shù)據(jù)庫時,你會發(fā)現(xiàn)這東西挺有趣的。

?

SQLLite的使用:


先介紹三個核心方法

1、openDatabase:這個方法使用現(xiàn)有數(shù)據(jù)庫或創(chuàng)建新數(shù)據(jù)庫創(chuàng)建數(shù)據(jù)庫對象。

2、transaction:這個方法允許我們根據(jù)情況控制事務(wù)提交或回滾。

3、executeSql:這個方法用于執(zhí)行真實的SQL查詢。

這三個方法的具體使用方法:

(1)openDatabase方法打開一個已經(jīng)存在的數(shù)據(jù)庫,如果數(shù)據(jù)庫不存在,它還可以創(chuàng)建數(shù)據(jù)庫。幾個參數(shù)意義分別是:

  • 1,數(shù)據(jù)庫名稱。
  • 2,數(shù)據(jù)庫的版本號,目前來說傳個1.0就可以了,當(dāng)然可以不填;
  • 3,對數(shù)據(jù)庫的描述。
  • 4,設(shè)置分配的數(shù)據(jù)庫的大小(單位是kb)。
  • 5,回調(diào)函數(shù)(可省略)。初次調(diào)用時創(chuàng)建數(shù)據(jù)庫,以后就是建立連接了。

(2)db.transaction方法可以設(shè)置一個回調(diào)函數(shù),此函數(shù)可以接受一個參數(shù)就是我們開啟的事務(wù)的對象。然后通過此對象可以進行執(zhí)行Sql腳本,跟下面的步驟可以結(jié)合起來。

(3)通過executeSql方法執(zhí)行查詢。

ts.executeSql(sqlQuery,[value1,value2..],dataHandler,errorHandler)

參數(shù)說明:

  • qlQuery:需要具體執(zhí)行的sql語句,可以是create、select、update、delete;
  • value1,value2..]:sql語句中所有使用到的參數(shù)的數(shù)組,在executeSql方法中,將s>語句中所要使用的參數(shù)先用“?”代替,然后依次將這些參數(shù)組成數(shù)組放在第二個參數(shù)中
  • ataHandler:執(zhí)行成功是調(diào)用的回調(diào)函數(shù),通過該函數(shù)可以獲得查詢結(jié)果集;
  • 4,errorHandler:執(zhí)行失敗時調(diào)用的回調(diào)函數(shù);


初次調(diào)用時創(chuàng)建數(shù)據(jù)庫,以后就是建立連接了。創(chuàng)建的數(shù)據(jù)庫就存在本地,路徑如下:
C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\databases\http_localhost_4987 。
創(chuàng)建的是一個sqllite數(shù)據(jù)庫,可以用SQLiteSpy打開文件,可以看到里面的數(shù)據(jù)。SQLiteSpy是一個綠色軟件,可以百度一下下載地址或SQLiteSpy官方下載;

?

下面將一一將介紹怎樣創(chuàng)建打開數(shù)據(jù)庫,創(chuàng)建表,添加數(shù)據(jù),更新數(shù)據(jù),刪除數(shù)據(jù),刪除表 。

?

第一步:打開連接并創(chuàng)建數(shù)據(jù)庫

var dataBase = openDatabase("student", "1.0", "學(xué)生表", 1024 * 1024, function () { }); if (!dataBase) { alert("數(shù)據(jù)庫創(chuàng)建失敗!"); } else { alert("數(shù)據(jù)庫創(chuàng)建成功!"); }

?

第二步:創(chuàng)建數(shù)據(jù)表

this.createTable=function() { dataBase.transaction( function(tx) { tx.executeSql( "create table if not exists stu (id REAL UNIQUE, name TEXT)", [], function(tx,result){ alert('創(chuàng)建stu表成功'); }, function(tx, error){ alert('創(chuàng)建stu表失敗:' + error.message); }); }); }


解釋一下,
executeSql函數(shù)有四個參數(shù),其意義分別是:
1)表示查詢的字符串,使用的SQL語言是SQLite 3.6.19。
2)插入到查詢中問號所在處的字符串?dāng)?shù)據(jù)。
3)成功時執(zhí)行的回調(diào)函數(shù)。返回兩個參數(shù):tx和執(zhí)行的結(jié)果。
4)一個失敗時執(zhí)行的回調(diào)函數(shù)。返回兩個參數(shù):tx和失敗的錯誤信息。

?

第三步:執(zhí)行增刪改查

1)添加數(shù)據(jù):

this.insert = function () { dataBase.transaction(function (tx) { tx.executeSql( "insert into stu (id, name) values(?, ?)", [id, '徐明祥'], function () { alert('添加數(shù)據(jù)成功'); }, function (tx, error) { alert('添加數(shù)據(jù)失敗: ' + error.message); } ); });

?

2)查詢數(shù)據(jù):

?

this.query = function () { dataBase.transaction(function (tx) { tx.executeSql( "select * from stu", [], function (tx, result) { //執(zhí)行成功的回調(diào)函數(shù) //在這里對result 做你想要做的事情吧........... }, function (tx, error) { alert('查詢失敗: ' + error.message); } ); }); }


解釋一下
上面代碼中執(zhí)行成功的回調(diào)函數(shù)有一參數(shù)result。

result:查詢出來的數(shù)據(jù)集。其數(shù)據(jù)類型為 SQLResultSet ,就如同C#中的DataTable。
SQLResultSet 的定義為:

interface SQLResultSet { readonly attribute long insertId; readonly attribute long rowsAffected; readonly attribute SQLResultSetRowList rows; };


其中最重要的屬性—SQLResultSetRowList 類型的 rows 是數(shù)據(jù)集的“行” 。
rows 有兩個屬性:length、item 。
故,獲取查詢結(jié)果的某一行某一列的值 :result.rows[i].item[fieldname]? 。

3)更新數(shù)據(jù)

?

this.update = function (id, name) { dataBase.transaction(function (tx) { tx.executeSql( "update stu set name = ? where id= ?", [name, id], function (tx, result) { }, function (tx, error) { alert('更新失敗: ' + error.message); }); }); }

4)刪除數(shù)據(jù)

?

this.del = function (id) { dataBase.transaction(function (tx) { tx.executeSql( "delete from stu where id= ?", [id], function (tx, result) { }, function (tx, error) { alert('刪除失敗: ' + error.message); }); }); }


?

5)刪除數(shù)據(jù)表

this.dropTable = function () { dataBase.transaction(function (tx) { tx.executeSql('drop table stu'); }); }

總結(jié)

以上是生活随笔為你收集整理的(九)HTML5本地存储——本地数据库SQLLite的使用的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。