一、成果展示
二、知识点
(一)Geolocation API
Geolocation API 用于检索用户的位置,例如,它可以用于使用映射 API 显示他们的位置。
网址:https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API/Using_the_Geolocation_API#examples
三、代码
(一)index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>Hello, Lee</h1> <script> if('geolocation' in navigator) { /* geolocation is available */ console.log("geolocation available"); navigator.geolocation.getCurrentPosition((position) => { const lat = position.coords.latitude; const lon = position.coords.longitude; document.getElementById('latitude').textContent = lat; document.getElementById('longitude').textContent = lon; }); } else { /* geolocation IS NOT available */ console.log("geolocation not available") } </script> <P>latitude: <span id="latitude"></span>°</P> <P>longitude: <span id="longitude"></span>°</P> </body> </html>
参考:https://www.youtube.com/watch?v=3ls013DBcww&list=PLRqwX-V7Uu6YxDKpFzf_2D84p0cyk4T7X&index=10