一、離線檢測(cè)
開發(fā)離線應(yīng)用的第一步是要知道設(shè)備是在線還是離線，HTML5為此定義了一個(gè)navigator.onLine屬性，這個(gè)屬性值為true 表示設(shè)備能上網(wǎng)礼饱，值為false 表示設(shè)備離線。
if(navigator.onLine){
//正常工作
}else{
//執(zhí)行離線狀態(tài)時(shí)的工作
}
HTML5 還定義了兩個(gè)事件：online 和offline究驴。當(dāng)網(wǎng)絡(luò)從離線變?yōu)樵诰€或者從在線變?yōu)殡x線時(shí)镊绪，分別觸發(fā)這兩個(gè)事件
二、應(yīng)用緩存
HTML5 的應(yīng)用緩存（application cache）洒忧，或者簡(jiǎn)稱為appcache蝴韭，是專門為開發(fā)離線Web 應(yīng)用而設(shè)計(jì)的。Appcache 就是從瀏覽器的緩存中分出來的一塊緩存區(qū)熙侍。要想在這個(gè)緩存中保存數(shù)據(jù)榄鉴，可以使用一個(gè)描述文件（manifest file），列出要下載和緩存的資源蛉抓。
三庆尘、數(shù)據(jù)存儲(chǔ)
1、Cookie
2巷送、IE用戶數(shù)據(jù)
3驶忌、Web存儲(chǔ)機(jī)制
Web Storage 的目的是克服由cookie 帶來的一些限制，當(dāng)數(shù)據(jù)需要被嚴(yán)格控制在客戶端上時(shí)笑跛，無(wú)須持續(xù)地將數(shù)據(jù)發(fā)回服務(wù)器付魔。Web Storage 的兩個(gè)主要目標(biāo)是：
提供一種在cookie 之外存儲(chǔ)會(huì)話數(shù)據(jù)的途徑聊品；
提供一種存儲(chǔ)大量可以跨會(huì)話存在的數(shù)據(jù)的機(jī)制。
-
Storage類型
Storage 類型提供最大的存儲(chǔ)空間（因?yàn)g覽器而異）來存儲(chǔ)名值對(duì)兒几苍。Storage 的實(shí)例與其他對(duì)象類似翻屈，有如下方法。
clear()： 刪除所有值妻坝；Firefox 中沒有實(shí)現(xiàn) 伸眶。
getItem(name)：根據(jù)指定的名字name 獲取對(duì)應(yīng)的值。
key(index)：獲得index 位置處的值的名字惠勒。
removeItem(name)：刪除由name 指定的名值對(duì)兒赚抡。
setItem(name, value)：為指定的name 設(shè)置一個(gè)對(duì)應(yīng)的值爬坑。 -
sessionStorage對(duì)象：
sessionStorage 對(duì)象存儲(chǔ)特定于某個(gè)會(huì)話的數(shù)據(jù)纠屋，也就是該數(shù)據(jù)只保持到瀏覽器關(guān)閉。這個(gè)對(duì)象就像會(huì)話cookie盾计，也會(huì)在瀏覽器關(guān)閉后消失售担。存儲(chǔ)在sessionStorage 中的數(shù)據(jù)可以跨越頁(yè)面刷新而存在，同時(shí)如果瀏覽器支持署辉，瀏覽器崩潰并重啟之后依然可用（Firefox 和WebKit 都支持族铆，IE 則不行）。
//使用方法存儲(chǔ)數(shù)據(jù)
sessionStorage.setItem("name", "Tom");
// 使用屬性存儲(chǔ)數(shù)據(jù)
sessionStorage.book = "Professional JavaScript";
-
globalStorage對(duì)象
這個(gè)對(duì)象的目的是跨越會(huì)話存儲(chǔ)數(shù)據(jù)哭尝，但有特定的訪問限制哥攘。要使用globalStorage，首先要指定哪些域可以訪問該數(shù)據(jù)材鹦∈叛停可以通過方括號(hào)標(biāo)記使用屬性來實(shí)現(xiàn)，如以下例子所示桶唐。
globalStorage["wrox.com"].name = "Tom";
var name = globalStorage["wrox.com"].name;
-
localStorage對(duì)象
localStorage 對(duì)象在修訂過的HTML 5 規(guī)范中作為持久保存客戶端數(shù)據(jù)的方案取代了globalStorage。與globalStorage 不同，不能給localStorage 指定任何訪問規(guī)則步悠；規(guī)則事先就設(shè)定好了巾钉。要訪問同一個(gè)localStorage 對(duì)象，頁(yè)面必須來自同一個(gè)域名（子域名無(wú)效）坯约，使用同一種協(xié)議熊咽，在同一個(gè)端口上。這相當(dāng)于globalStorage[location.host]闹丐。
localStorage.setItem("name", "Tom");
localStorage.book = "Professional JavaScript";
var name = localStorage.getItem("name");
var book = localStorage.book;
-
Sorage事件
對(duì)Storage 對(duì)象進(jìn)行任何修改横殴，都會(huì)在文檔上觸發(fā)storage 事件。當(dāng)通過屬性或setItem()方法保存數(shù)據(jù)妇智，使用delete 操作符或removeItem()刪除數(shù)據(jù)滥玷，或者調(diào)用clear()方法時(shí)氏身，都會(huì)發(fā)生該事件。這個(gè)事件的event 對(duì)象有以下屬性惑畴。
?domain：發(fā)生變化的存儲(chǔ)空間的域名蛋欣。
?key：設(shè)置或者刪除的鍵名。
?newValue：如果是設(shè)置值如贷，則是新值陷虎；如果是刪除鍵，則是null杠袱。
?oldValue：鍵被更改之前的值尚猿。
