一、地理位置( geolocation ):
navigator.geolocation对象:
1、单次请求:
//navigator.geolocation.getCurrentPosition(
function(res){
//请求成功函数:
(调用方式:res.coords.longitude)
经度:coords.longitude
维度:coords.latitude
精准度:coords.accuracy
海拔:coords.altitude
海拔精准度:coords.altitudeAcuracy
行进方向:coords.heading
地面速度:coords.speed
时间戳: new Date(position.timestamp);
},
function(err){
//请求失败:
console.log(err.code);
//0: 不包括其他编号中的错误
1:用户拒绝共享位置
2:尝试获取用户信息,失败了
3:设置了timeout值,获取位置超时了
},{
//数据收集方式:
enableHighAcuracy : 更精确的查找,默认false
timeout : 获取位置允许最长时间,默认infinity
maximumAge : 位置可以缓存的最大时间,默认0
}); 2、多次定位请求:
//watchPosition(); --> 多次定位请求
--- 移动设备有用,位置改变时触发
--- 配置参数:frequency 更新的频率 //clearWatch(); --> 关闭跟新请求
--navigator.geolocation.clearWatch(); 二、本地存储( storage ):
1.cookie:
一个域名400k大小
每次使用都要请求服务器
数据共享
2.storege: ( 存储限制5M )
a、sessionStorage:(临时存储,页面关闭消失,数据不共享)
b、localStorage:(永久存储,可手动删除,数据共享)
c、API:
(1)、setItem(); 设置存储
(2)、getItem(); 获取存储
(3)、removeItem(); 删除存储
(4)、clear(); 清楚所有存储
(5)、storage //事件:当有数据修改或删除就会触发(修改的窗口不会触发storage事件)
-->storage事件中的ev对象中存储如下数据:
*ev.key: 修改或删除的可key值 如果调用clear()则为null
*ev.newValue: 新设置的值 如果调用removeStorage(),key为null
*ev.olValue: 改变前的值
*ev.storageArea: 当前的storage对象(中存储的所有的值)
*ev.url: 出发该脚本变化的文档
注:session同窗口才可以,例如:iframe操作

地理位置(navigation.geolocation)与本地存储(seessionStorage、localStorage)的更多相关文章

  1. html5本地存储(localStorage)使用介绍

    1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(application cache) indexedDB 和 webSQ ...

  2. store.js - 轻松实现本地存储(LocalStorage)

    store.js 是一个兼容所有浏览器的 LocalStorage 包装器,不需要借助 Cookie 或者 Flash.store.js 会根据浏览器自动选择使用 localStorage.globa ...

  3. (转)HTML5开发学习(2):本地存储之localStorage 、sessionStorage、globalStorage

    原文:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html HTML5开发学习(2):本地存储之localStorage ...

  4. web 本地存储 (localStorage、sessionStorage)

    web 本地存储 (localStorage.sessionStorage,cookie) localStorage(长期储存):即使关闭浏览器数据也不会删除,除非使用localStorage.cle ...

  5. [web 前端] web本地存储(localStorage、sessionStorage)

    cp from : https://blog.csdn.net/mjzhang1993/article/details/70820868 web 本地存储 (localStorage.sessionS ...

  6. web本地存储(localStorage、sessionStorage)

    web 本地存储 (localStorage.sessionStorage) 说明 对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:l ...

  7. html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例

    这篇文章主要介绍了html5本地存储的localstorage .本地数据库.sessionStorage简单使用示例,需要的朋友可以参考下 html5的一个非常cool的功能,就是web stora ...

  8. js本地存储解决方案(localStorage与userData)

    WEB应用的快速发展,是的本地存储一些数据也成为一种重要的需求,实现的方案也有很多,最普通的就是cookie了,大家也经常都用,但是cookie的缺点是显而易见的,其他的方案比如:IE6以上的user ...

  9. 本地存储之localStorage

    localStorage 本地存储 .对象.存数据 .取数据 存储的数据量在20M左右 localStorage 是window下面的属性,用的时候可以省略window 数据只能存储字符串类型的 lo ...

随机推荐

  1. Spring AOP(转载)

    此前对于AOP的使用仅限于声明式事务,除此之外在实际开发中也没有遇到过与之相关的问题.最近项目中遇到了以下几点需求,仔细思考之后,觉得采用AOP 来解决.一方面是为了以更加灵活的方式来解决问题,另一方 ...

  2. Android 调用QQ登录

    调用QQ登录        在如今的项目开发.调用第三方登录.差点儿是必须的,而调用QQ登录也是不可缺少的,这里把相关代码分享出来,希望能拿去就能够用,降低项目开发的时间.希望对大家实用. 1,去QQ ...

  3. ajax 实现三级联动下拉菜单

    ajax 实现三级联动,相当于写了一个小插件,用的时候直接拿过来用就可以了,这里我用了数据库中的chinastates表, 数据库内容很多,三级联动里的地区名称都在里面,采用的是代号副代号的方式 比如 ...

  4. ubuntu12.04出现ERROR: Removing 'hello': Device or resource busy和insmod: error inserting 'hello.ko': -1 Device or resource busy解决方案

    一:insmod时候错误: 1:错误信息insmod: error inserting 'hello.ko': -1 Device or resource busy 2:原因:你的代码里面的设备号和系 ...

  5. Understand .sync in Vue

    Preface The first time I met .sync modifier, I didn't know it very well. So, I seldom use that. Toda ...

  6. HDU5171 GTY's birthday gift —— 矩阵快速幂

    题目链接:https://vjudge.net/problem/HDU-5171 GTY's birthday gift Time Limit: 2000/1000 MS (Java/Others)  ...

  7. Codeforces Round #303 (Div. 2) D. Queue —— 贪心

    题目链接:http://codeforces.com/problemset/problem/545/D 题解: 问经过调整,最多能使多少个人满意. 首先是排序,然后策略是:如果这个人对等待时间满意,则 ...

  8. 一个selenium笔试题——去哪网首页获取符合要求的url并保存

    今天在群里看到这样一个笔试题:请使用任何熟悉的面向对象编程语言,编写代码,获取http://www.qyer.com页面中,所有</a>标签"href"属性值包含英文单 ...

  9. ping请求超时的解决方法

    我们有时需要进行远程或者共享对方数据库的时候,会ping一下对方电脑,时候能够ping通,时候能够进行数据的传输.有时会出现ping请求超时,那么遇到这个问题该怎么解决? 我们首要解决的是看他自己是否 ...

  10. 编译Thrift

    按照 https://syslint.com/blog/tutorial/how-to-install-apache-thrift-on-ubuntu-14-04/ 进行, 编译时出现错误 make[ ...