geolocation——定位

  PC——IP地址

    精度比较低

    IP库

      Chrome -> Google

  手机——GPS

  window.navigator.geolocation

    单次    getCurrentPosition(成功, 失败, 参数)

      enableHighAccuracy      高精度模式——更慢、更费电

      timeout                 超时

      maximumAge              缓存时间

      结果：

        latitude/longitude    纬度/经度

        altitude              海拔高度

        accuracy              精确度

        altitudeAccuracy      高度精确度

        heading               朝向

        speed                 速度

    监听    watchPosition(成功, 失败, 参数)

　demo；

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <script type="text/javascript">

    window.onload=function (){

      let oBtn=document.getElementById('btn1');

      oBtn.onclick=function (){

        if(window.navigator.geolocation){

          navigator.geolocation.getCurrentPosition(res=>{

            alert('成功');

          }, err=>{

            alert('失败');

          }, {

            /*

            enableHighAccuracy          //高精度模式

            timeout                     //超时时间

            maximumAge                  //缓存

            */

          });

        }else{

          alert('你的浏览器不支持定位');

        }

      };

    };

    </script>

    <title></title>

  </head>

  <body>

    <input type="button" name="" value="定位" id="btn1">

  </body>

</html>

　　

H5-geolocation学习的更多相关文章

  1. 值得H5前端学习的60个JS插件(含DEMO演示)

    下面也可以说是H5前端学习的js插件大全.基本包含了大部分的前端最前沿的js插件和库. 布局 SuperEmbed.js- 是一个Javascript库,可检测出网页上的内嵌视频并使他们能够变成响应式 ...

  2. HTML5 Geolocation学习

    GeolocationAPI学习,我写的挺枯燥的,直接跳到最后看示例. 5.1 位置信息 HTML5 Geolocation API的使用方法相当简单.请求一个位置信息,如果用户同意,浏览器就会返回位 ...

  3. H5性能测试学习

    工欲善其事,必先利其器,在做H5前端性能测试之前,选择合适的工具能让我们的测试工作事半功倍.本文要提到的工具有两类: 一类是抓包工具,如Fiddler.Charles等.这类工具不仅可以抓包,还可以对 ...

  4. H5的学习之旅-H5的实体（14）

    H5有些关键字比如<等等是显示不出来的,这时候,就需要用实体来表示,实体我理解就是最初的编码 代码实例 <!DOCTYPE html> <html lang="en& ...

  5. H5案例学习笔记

    ★基础篇     增加主体结构元素    

  6. h5 meta学习

    定义针对搜索引擎的关键词:<meta name="keywords" content="meta,red" /> 定义对页面的描述:<meta ...

  7. H5 css学习

    p{text-indent:2em;}段前空两格   段落排版--行间距(行高) p{line-height:1.5em;} 段落排版--中文字间距.字母间距  h1{    letter-spaci ...

  8. 新站上线啦，Html5Think，H5优秀资源的收集、学习、分享和交流

    最近闲来做了个H5资源站,刚刚有点资源,可以访问交流下. 栏目: H5网站模板 H5动画特效 H5资源工具 H5学习资料 致力于H5的学习,通过各个H5优秀案例的学习,逐步完善自己的H5体系,有朝一日 ...

  9. 2017.3.12 H5学习的第一周

    本周我开始了H5的学习,在这一周里我们从html的基本标签开始一直讲到了才算css的用法,接下来我将记录下来本周我学到的H5的内容. 首先是声明文档,声明文档类型是HTML5文件,它在HTML文档必不 ...

  10. 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

随机推荐

  1. Lord Of The Root: 1.0.1实战

    前言 Description:我创建这台机器是为了帮助其他人学习一些基本的CTF黑客策略和一些工具.我瞄准了这台机器,使其在难度上与我在OSCP上破解的机器非常相似. 这是一个引导到根计算机将不需要任 ...

  2. C#.NET Framework 使用BC库（BouncyCastle） RSA 公钥加密 私钥解密 ver:20230706

    C#.NET Framework 使用BC库(BouncyCastle) RSA 公钥加密 私钥解密 ver:20230706 环境说明: .NET Framework 4.6 的控制台程序 . 20 ...

  3. JavaScript进阶指南： DOM与BOM操作，从初学者到专家，一步也能登天一篇文章就足够了

    DOM与BOM操作 复习链接: http://c.biancheng.net/view/9360.html 事件对象: https://www.runoob.com/jsref/dom-obj-eve ...

  4. 普通用户启动 supervisor 报 HTTP 错误（strace）

    公司的开发对生产环境都有普通用户 www 的权限,采用堡垒机登录到生产环境的机器. 默认 supervisor 使用 root 用户启动,开发没有权限直接修改配置和操作 supervisor 管理的进 ...

  5. MAUI Blazor项目中如何添加一个返回服务，并支持安卓返回键

    前言 MAUI Blazor中,安卓项目的返回键体验很不好,只能如同浏览器一样返回上一页.但很多时候,我们想让他返回的上一页,不一定就是实际上的上一页.而且也想让返回键去支持一些事件,按下返回键触发, ...

  6. Llama 2 来袭 - 在 Hugging Face 上玩转它

    引言 今天,Meta 发布了 Llama 2,其包含了一系列最先进的开放大语言模型,我们很高兴能够将其全面集成入 Hugging Face,并全力支持其发布. Llama 2 的社区许可证相当宽松,且 ...

  7. v4l2采样usb摄像头并显示

    ubuntu 思路: 1. 首先理解camera工作原理,重点理解 yuv,rgb视频流, 即Sensor数据输出的图像格式; 大体过程:光线通过镜头Lens进入摄像头内部,通过IR过滤掉红外光,抵达 ...

  8. 王道oj/problem16

    网址:http://oj.lgwenda.com/problem/16 思路:都在注释里,注意增删查的参数以及停止条件 代码: #define _CRT_SECURE_NO_WARNINGS#incl ...

  9. Linq开发技巧与业务逻辑校验

    Linq 是一种基于 .NET Framework 的编程语言,它的出现极大地提高了开发效率.Linq 提供了一种统一的查询语法,使得开发人员可以使用一种语言来查询不同类型的数据源,包括对象.集合.数 ...

  10. 利用pytorch准备数据集、构建与训练、保存与加载CNN模型

    本文的主要内容是利用pytorch框架与torchvision工具箱,进行准备数据集.构建CNN网络模型.训练模型.保存和加载自定义模型等工作.本文若有疏漏.需更正.改进的地方,望读者予以指正,如果本 ...