這兩年離線瀏覽技術越來越流行，最常見的就是HTML5移動應用里，有很多普通的Web app也使用了這些技術。但是，新技術的出現(xiàn)有時會給我們WEB開發(fā)人員帶領額外的苦惱，比如，如何判斷用戶現(xiàn)在是在線還是離線？幸好，有矛就有盾，JavaScript里的navigator對象幫我們解決這個問題。

相關學習推薦：javascript視頻教程

navigator.onLine

navigator.onLine屬性能給我們提供一個布爾值，用來判斷用戶是否連接了互聯(lián)網(wǎng)。你可以這樣訪問它：

if(navigator.onLine) { // true|false 	// ... }

沒有比這更簡單的了！

事件

我們除了能檢測這個離線/在線屬性值外，還可以綁定offline 和 online事件：

function updateIndicator() { 	// 這時可以根據(jù)offline/online按鈕的顏色 }  // 根據(jù)網(wǎng)絡連接情況更新在線狀態(tài) window.addEventListener('online',  updateIndicator); window.addEventListener('offline', updateIndicator); updateIndicator();

當然，老式的技術里也提供了相應的方法，在body標記上使用ononline 和 onoffline 方法。

我可以想象到很多地方都需要使用這些事件和屬性。比如一種情況，當用戶正在工作時，斷網(wǎng)了，如果我們的WEB應用可以檢測出這種狀態(tài)，可以將用戶的寫作保持到本地的Web Storage里，等網(wǎng)絡恢復后，再提交到服務器上，這樣，斷網(wǎng)將不會給用戶的寫作帶來影響。這只是一個簡單的例子，相信你能想出