html5 geolocation 地理定位

2022-08-24 14:30:22 阅读：186 来源： 互联网

标签：function geolocation 定位 html5 getGeolocation position navigator div1

html5 获取经纬度，前提用户开启可获取权限

展示代码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    #div1 {width:auto;height:70px;padding:10px;border:1px solid #aaaaaa;}

  </style>
  <script>
    var x;
    function getGeolocation(){
      if(navigator.geolocation){
        navigator.geolocation.getCurrentPosition(showPosition);
      }
    }
    function showPosition(position){
        x.innerHTML="纬度: " + position.coords.latitude + 
        "<br>经度: " + position.coords.longitude;    
    }

    window.onload = function () {
      x=document.getElementById("div1");
      getGeolocation();
    }
    
  </script>
    
</head>
<body>

  <div id="div1"></div>
  
</body>

</html>

标签：function,geolocation,定位,html5,getGeolocation,position,navigator,div1
来源： https://www.cnblogs.com/bky-1/p/16619783.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

html5 geolocation 地理定位