Web Storage分為兩類：

- sessionStorage：數(shù)據(jù)保存在session 對(duì)象中(臨時(shí))

- localStorage：數(shù)據(jù)保存在本地硬件設(shè)備中(永久)

sessionStorage:

保存數(shù)據(jù)的兩種方法：

sessionStorage.setItem('key','val');

sessionStorage.key = 'val';

讀取數(shù)據(jù)的兩種方法：

sessionStorage.getItem('key');

var temp = sessionStorage.key;

清除數(shù)據(jù)的方法：

sessionStorage.removeItem('key')

注意：鍵名即'key'是不能重復(fù)的，鍵名頁(yè)也不能刪除。

示例：

sessionStorage.world='hello world';

sessionStorage.setItem('kitty','hello kitty');

在javascript中運(yùn)行上述代碼，用瀏覽器打開(kāi)該頁(yè)面后按F12呼出控制臺(tái)，選擇Resources標(biāo)簽頁(yè)下的Session Storage選項(xiàng)，可以看到上述兩條數(shù)據(jù)已經(jīng)被存入了:

當(dāng)執(zhí)行清除后：

sessionStorage.removeItem('kitty');

相應(yīng)鍵名的數(shù)據(jù)被刪除：

現(xiàn)在sessionStorage中插入如下數(shù)據(jù)：

獲取session中的數(shù)據(jù)條數(shù)(sessionStorage.length)，并在控制臺(tái)打印出來(lái)：

console.log(sessionStorage.length);

獲取指定索引下標(biāo)對(duì)應(yīng)的鍵名(sessionStorage.key(index))：

console.log(sessionStorage.key(1));

清除所有數(shù)據(jù)：

sessionStorage.clear(2881064151);

通過(guò)window對(duì)象對(duì)storage添加監(jiān)聽(tīng)事件：

window.addEventListener(‘storage’,function(event){ });

event的屬性值：

- event.key：storage中被修改的鍵值

- event.oldValue：被修改前的值

- event.newValue：被修改后的值

- event.url：storage 中值得頁(yè)面URL地址

localStorage與sessionStorage使用方法一致，只需要變下名字

區(qū)別在于localSorage是永久保存，而sessionStorage會(huì)在瀏覽器關(guān)閉時(shí)自動(dòng)清除。sessionStorage可以用來(lái)暫時(shí)保存登陸后的用戶名等信息。

實(shí)用的本地?cái)?shù)據(jù)庫(kù)：

html5?內(nèi)置了兩種數(shù)據(jù)庫(kù)一種是SQLLite 可以通過(guò)SQL語(yǔ)言來(lái)訪問(wèn)的文件型SQL數(shù)據(jù)庫(kù)，另外一種是indexedDB的noSQL類型的數(shù)據(jù)庫(kù)。

這里主要介紹下SQLLite

創(chuàng)建訪問(wèn)數(shù)據(jù)庫(kù)對(duì)象：

var db=openDatabase("gameDB","1.0","游戲數(shù)據(jù)庫(kù)",1024*1024);

參數(shù)：1.數(shù)據(jù)庫(kù)名，如果存在就打開(kāi)，如果不存在就創(chuàng)建一個(gè) 2.版本號(hào)，默認(rèn)1.0 3.數(shù)據(jù)庫(kù)描述 4.數(shù)據(jù)庫(kù)大小，單位字節(jié)，1024*1024即1M，一般1M到2M就夠用了。

訪問(wèn)數(shù)據(jù)庫(kù)：

db.transaction(function(tx){

tx.executeSql("SQL語(yǔ)句",[],function(tx,rs){},function(tx,err){});

});

參數(shù)：1.SQL語(yǔ)句 2.SQL參數(shù)組 3.執(zhí)行SQL成功時(shí)的回調(diào)函數(shù) 4.執(zhí)行SQL失敗時(shí)的回調(diào)函數(shù)。

其中執(zhí)行成功回調(diào)函數(shù)中的rs代表結(jié)果集，其中的rows屬性保存了每條數(shù)據(jù)。

用之前做的游戲舉個(gè)實(shí)例：

var username=$("username").value;

var db=openDatabase("gameDB","1.0","游戲數(shù)據(jù)庫(kù)",1024*1024);

db.transaction(function(tx){

tx.executeSql("create table t_defenders (username varchar(20),score int)",[],function(tx,rs){},function(tx,err){});

});

db.transaction(function(tx){

tx.executeSql("insert into t_defenders values(?,?)",[username,killNum*100],function(tx,rs){},function(ts,err){});

});

作用為當(dāng)游戲結(jié)束時(shí)，在本地?cái)?shù)據(jù)庫(kù)中創(chuàng)建名為t_defenders的表，之后獲取名字與得分存入表中：

復(fù)制代碼

var db=openDatabase("gameDB","1.0","游戲數(shù)據(jù)庫(kù)",1024*1024);

db.transaction(function(tx){

tx.executeSql("select * from t_defenders order by score desc limit 5",[],function(tx,rs){

var row = rs.rows;

$("score-table").innerHTML = "";

var str = "

名次玩家姓名分?jǐn)?shù)";

for(var i = 0;i

str += "

"+(i+1)+""+row.item(i).username+""+row.item(i).score+"";

}

$("score-table").innerHTML += str;

},function(ts,err){});

總結(jié)

以上是生活随笔為你收集整理的sqllite能连接mysql_SQLLite 可以通过SQL语言来访问的文件型SQL数据库的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

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