html5-深刻淺出（3）

時間 2019-12-12

標籤 html5 html 深刻欄目 HTML5 简体版

原文原文鏈接

在線和離線事件

　　navigator.onLine 是一個值爲 true/false (true 表示在線， false 表示離線) 的屬性。。當瀏覽器從在線與離線狀態中切換時，會觸發「online」與「offline」這兩個事件，這兩個事件會在頁面的 <body> 上觸發。此外，該事件會從 document.body 冒泡到 document 上，最後到達 window。兩個事件都沒法被取消(你沒法阻止用戶進入在線或離線狀態)。html

<script>
        function updateOnlineStatus(event) {
            var condition = navigator.onLine ? "online" : "offline";
            console.log("Event: " + event.type + "; Status: " + condition);
        }
        window.addEventListener("offline", updateOnlineStatus)
        window.addEventListener("online", updateOnlineStatus)
 </script>

　　只有網絡狀態變化時，此事件纔會觸發git

地理位置

　　地理位置 API 經過 navigator.geolocation 提供。若是該對象可用，那麼地理位置服務就可以使用瀏覽器

if ("geolocation" in navigator) {
  /* 地理位置服務可用 */
} else {
  /* 地理位置服務不可用 */
}

　　能夠調用 getCurrentPosition() 函數獲取用戶當前定位位置。這會異步地請求獲取用戶位置，並查詢定位硬件來獲取最新信息。當定位被肯定後，定義的回調函數就會被執行。您能夠選擇性地提供第二個回調函數，當有錯誤時會被執行。第三個參數也是可選的，您能夠經過該對象參數設定最長可接受的定位返回時間、等待請求的時間和是否獲取高精度定位。緩存

<!-- 
            enableHighAccuracy Boolean值、是否使用其最高精度來表示結果。若是值爲 true，同時設備可以提供一個更精確的位置，那麼設備就會使用這個位置。注意，這會致使較慢的響應時間或者增長電量消耗。若是值爲false，會盡快返回一個低精度結果。默認值： false。
            timeout long值、它代表的是設備必須在多長時間（單位毫秒）內返回一個位置。默認值是 Infinity，意思是獲取到一個位置以後，纔會返回一個值。
            maximumAge long值、它代表能夠返回多長時間（即最終年齡，單位毫秒）內的可獲取的緩存位置。若是設置爲 0, 說明設備不能使用一個緩存位置，並且必須去獲取一個真實的當前位置。若是設置爲 Infinity，那麼無論設置的最終年齡是多少，設備都必須返回一個緩存位置。默認值：0。 -->

<script>
        if ("geolocation" in navigator) {
            /* 地理位置服務可用 */
            var geo = navigator.geolocation;
            geo.getCurrentPosition(function(position) {
                // latitude 維度  longitude 經度
                console.log(position.coords.latitude, position.coords.longitude)
            }, function(error) {
                /* 錯誤信息 */
                console.log(error)
            }, {
                enableHighAccuracy: true,
                maximumAge: 30000,
                timeout: 27000
            })
        } else {
            /* 地理位置服務不可用 */
        }
    </script>

監視定位

　　能夠設定一個回調函數來響應定位數據發生的變動（設備發生了移動，或獲取到了更高精度的地理位置信息）。能夠經過 watchPosition() 函數實現該功能。它與 getCurrentPosition() 接受相同的參數，將上面的getCurrentPosition直接替換便可，並且watchPosition（）函數會返回一個 ID，惟一地標記該位置監視器，若是咱們不想監聽的話，可使用該id ,清除監視定位網絡

navigator.geolocation.clearWatch(watchID);

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。