<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Location</title>

</head>

<body>

My location is :

<button id="btn1" onclick="getLocation()">Click</button>

<p id="output"></p>

<script type="text/javascript">

var output=document.getElementById("output");

function getLocation()

{

    if (navigator.geolocation)

    {

        navigator.geolocation.getCurrentPosition(showPosition);

    }

    else{output.innerHTML="Geolocation is not supported by this browser.";}

}

function showPosition(position)

{

    output.innerHTML="Latitude: " + position.coords.latitude +

        "<br />Longitude: " + position.coords.longitude;

}

</script>

</body>

</html>

　　

根据两点的经纬度，求距离：

参考：https://www.cnblogs.com/ycsfwhh/archive/2010/12/20/1911232.html

JS 获取当前定位的更多相关文章

  1. 原生js获取手机定位信息

    <script type="text/javascript"> function Location() {}; Location.prototype.getLocati ...

  2. Jquery和JS获取ul中li标签（转）

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  3. JS获取/设置iframe内对象元素、文档的几种方法

    1.IE专用(通过frames索引形象定位): document.frames[i].document.getElementById('元素的ID'); 2.IE专用(通过iframe名称形象定位): ...

  4. JS 获取浏览器窗口大小

    JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...

  5. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  6. Js获取当前日期时间

    Js获取当前日期时间 var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4 ...

  7. JS 获取浏览器和屏幕宽高等信息代码

    JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:doc ...

  8. js获取浏览器高度和宽度值,尽量的考虑了多浏览器。

    js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...

  9. js获取浏览器基本信息：document.body.clientWidth/clientHeight/scrollWidth/scrollTop。（转）

    js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011 ...

随机推荐

  1. Android App常用控件

  2. mobx是什么？有什么优点？

    mobx是一个简单可扩展的状态管理库. mobx vs redux mobx是学习成本更低,性能更好的状态解决方案. mobx开发难度低: mobx代码量少: mobx渲染性能好: mobx参考

  3. [Sdwc] 线段

    线段有如下两类特点:1 x y, 表示第 x 条线段和第 y 条线段相交 (相交在这里指至少有一个公共点)2 x y,表示第 x 条线段在第 y 条线段的左边,且它们不相交.共有 m 个特点,每个特点 ...

  4. AGC029C - Lexicographic constraints

    记录我心路历程吧,这道小水题暴露出我很多问题. 给定 \(n\) 个字符串长度 \(a_i\) ,求字符集最小多大,才能构造出按字典序比较 \(s_1 < s_2 < \dots < ...

  5. JS核心知识点：DOM\BOM\EVENT

    1.DOM(Document Object Model) :文档对象模型2. DOM节点:页面中最基本的组成部分 3. childNodes:获取某个节点下所有的子节点 在标准及ie9以上 : 会获取 ...

  6. 浅谈C++运算符重载

    首先,什么是运算符重载? C++里运算符重载主要有两种方法.一是通过类的成员函数进行重载,二是通过类的友元函数进行重载. 下面以简单的复数类complex为例: 下面是通过类的成员函数进行运算符的重载 ...

  7. 转载一篇比较详细的讲解html,css的一篇文章，很长

      转载自这里,转载请注明出处. DIV+CSS系统学习笔记回顾   第一部分 HTML 第一章 职业规划和前景 职业方向规划定位: web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 ...

  8. BZOJ 2402 陶陶的难题II (树链剖分、线段树、凸包、分数规划)

    毒瘤,毒瘤,毒瘤-- \(30000\)这个数据范围,看上去就是要搞事的啊... 题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=2402 ...

  9. Dubbo API 笔记——Dubbo架构与使用

    转载于: https://blog.csdn.net/benhuo931115/article/details/78457149 架构演变 单一应用架构 所有功能部署在一个应用上,用于简化增删改查工作 ...

  10. centos7下面ruby的升级

    背景 在做redis集群时,所需要的使用ruby工具进行操作,发现在线安装的Ruby版本过低,redis支持的版本最少为2.2.2. 在线安装ruby 使用yum在线安装ruby,安装的版本为2.0. ...