navigator.geolocation.getCurrentPosition(function(){
})
經度 : coords.longitude
緯度 : coords.latitude
准確度 : coords.accuracy
海拔 : coords.altitude
海拔准確度 : coords.altitudeAcuracy
行進方向 : coords.heading
地面速度 : coords.speed
請求的時間: new Date(position.timestamp)
獲取方法代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
* { margin: 0; padding: 0;}
#box {
width: 500px;
height: 500px;
border: 2px solid deeppink;
}
</style>
</head>
<body>
<button id='btn'> 請求位置信息 </button>
<div id="box"></div>
<script>
let btn = document.getElementById('btn');
let box = document.getElementById('box');
//點擊按鈕獲取地理位置信息
btn.onclick = function () {
//getCurrentPosition與定時器setInterval類似多次請求，因為位置需要不間斷的獲取
//直接navigator.geolocation表示單次獲取位置
navigator.geolocation.getCurrentPosition(function (position) {
box.innerHTML += "經度" + position.coords.longitude;
box.innerHTML += "緯度" + position.coords.latitude;
box.innerHTML += "准確度" + position.coords.accuracy;
box.innerHTML += "海拔" + position.coords.altitude;
box.innerHTML += "海拔准確度" + position.coords.altitudeAcuracy;
box.innerHTML += "行進方向" + position.coords.heading;
box.innerHTML += "地面速度" + position.coords.speed;
box.innerHTML += "請求的時間" + new Date(position.timestamp);
}, function (err) {
alert(err.code);
// code：返回獲取位置的狀態
// 0 : 不包括其他錯誤編號中的錯誤
// 1 : 用戶拒絕瀏覽器獲取位置信息
// 2 : 嘗試獲取用戶信息，但失敗了
// 3 : 設置了timeout值，獲取位置超時了
}, {
enableHighAcuracy: false, //位置是否精確獲取
timeout: 5000, //獲取位置允許的最長時間
maximumAge: 1000 //多久更新獲取一次位置
})
}
</script>
</body>
</html>
IE瀏覽器運行結果如下：
谷歌瀏覽器限制了獲取