From 235c34993c7b14f783fc8259cc237ac09f0d3e57 Mon Sep 17 00:00:00 2001 From: MDN Date: Fri, 9 Jul 2021 00:38:08 +0000 Subject: [CRON] sync translated content --- .../online_and_offline_events/index.html | 101 --------------------- 1 file changed, 101 deletions(-) delete mode 100644 files/zh-tw/web/api/navigatoronline/online_and_offline_events/index.html (limited to 'files/zh-tw/web/api/navigatoronline/online_and_offline_events') diff --git a/files/zh-tw/web/api/navigatoronline/online_and_offline_events/index.html b/files/zh-tw/web/api/navigatoronline/online_and_offline_events/index.html deleted file mode 100644 index c8bf629d8c..0000000000 --- a/files/zh-tw/web/api/navigatoronline/online_and_offline_events/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: Firefox 3 Online and Offline Events -slug: Web/API/NavigatorOnLine/Online_and_offline_events -translation_of: Web/API/NavigatorOnLine/Online_and_offline_events ---- -

Firefox 3 Online and Offline Events From MoztwWiki

-

Firefox 3 依據 WHATWG Web Applications 1.0 Specification 實做了 Offline/Online Events。

-

概觀

-

打造可以離線跑的網路應用程式時，我們往往需要讓程式知道目前的網路狀況。實際上，網路應用程式一般的需求可細分如下：

- -

有了 Online/offline events，要滿足這些需求變得很簡單。

-

此外，你的網路應用程式有時可能必須將某些 HTML 文件列入快取中，以便使用者離線時可以存取，如有這個需求，你可以在 HTML 文件的 <HEAD> 加入 <link> 元素：

-
<link rel="offline-resource" href="myresource">
-

Firefox 3 看到這些語法時，就會將這些資源列入一個特殊的離線資源快取(offline resource cache)中，讓使用者在離線時，依舊可以被存取這些資源。

-

API

- -
-
- avigator.onLine 是一個 property，其值可為 true/false (true 代表 online, false 代表 offline)。當使用者將瀏覽器切換成 Offline Mode 時(透過 主選單 -> 檔案 -> 離線模式)，這個 property 就會被更新。
-
-
-
- 除此之外，根據規格書的建議，在瀏覽器無法連接到網路時，也應該更新這個 property。規格書上是這樣寫的：
-
-
- The navigator.onLine attribute must return false if the user agent will not contact the network when the user follows links or when a script requests a remote page (or knows that such an attempt would fail)...
-
-
-
-
- Firefox 2 在我們將瀏覽器切換成為離線模式、或離開離線模式時，會更新這個 property，在失去網路連線、或重新連線到網路時，也會更新這個 property。
-
-
-
- 在比較老的 Firefox 與 Internet Explorer 版本，也有支援這個 property (事實上，規格書是依據這些之前版本的實做結果來制定的)，所以現在就可以馬上開始使用它。
-
-
-
- 但「自動偵測網路狀況」是在 Firefox 2 中才實做出來。
-
-

online and offline events

-
-
- Firefox 3 新增了兩個 events 的支援： "online" 及 "offline"。當我們切換瀏覽器的 online/offline 狀態時，就會對每個頁面的 <body> 觸發這兩個事件。除此之外，這兩個事件會從 document.body bubble up 到 document，到 window 才結束。這兩個事件都是 non-cancellable 的(因為你無法防止使用者連線到網路、或離線)。
-
-
-
- 有好幾種你熟悉的方式可以用來註冊這兩個事件的 listeners：
-
-
-
-
    -
  • 對 window, document 或 document.body 使用 addEventListener。
    • -
  • 對 document 或 document.body 設定 .ononline 或 .onoffline properties 作為一個 JavaScript Function object. (注意： 使用 window.ononline 或 window.onoffline 無法作用，這是為了相容性。)
    • -
  • 在 html 文件的 <body> 指定 ononline="..." 或 onoffline="..." attributes。
    • -
-
-
-

例子

-

這裡有個簡單的例子。

-
<!doctype html>
- <html>
- <head>
-   <script>
-     function updateOnlineStatus(msg) {
-       var status = document.getElementById("status");
-       var condition = navigator.onLine ? "ONLINE" : "OFFLINE";
-       status.setAttribute("class", condition);
-       var state = document.getElementById("state");
-       state.innerHTML = condition;
-       var log = document.getElementById("log");
-       log.appendChild(document.createTextNode("Event: " + msg + "; status=" + condition + "\n"));
-     }
-     function loaded() {
-       updateOnlineStatus("load");
-       document.body.addEventListener("offline", function () {
-         updateOnlineStatus("offline")
-       }, false);
-       document.body.addEventListener("online", function () {
-         updateOnlineStatus("online")
-       }, false);
-     }
-   </script>
-   <style>...</style>
- </head>
- <body onload="loaded()">
-   <div id="status"><p id="state"></p></div>
-   <div id="log"></div>
- </body>
- </html>
-

參考資料

- -- cgit v1.2.3-54-g00ecf