《HTM5基础扩展——地理位置、本地存储、缓存.docxVIP

HTML5基础扩展——地理位置、本地存储、缓存?HTML5扩展,继上两篇博客,我们来看一下HTML5的一些扩展的功能,由于HTML5更多是为了兼容电脑浏览器,安卓浏览器,苹果浏览器更多浏览器,或者说为这些浏览器提供一个统一的标准.因此目前在手机上的web开发，HTML5是比较火的。因此这几款扩展功能，感觉更多是从手机，平板等角度出发的。?一，地理定位：首先看一下地理位置的定位的几种形式：IP地址，GPS（Global Positioning System ），Wifi，GSM（Global System for Mobile Communication ）/CDMA（Code Division Multiple Access）。一般手机都是通过GPS进行定位的，相对准确。好看一下HTML5如何实现地理位置：1.?实现基于浏览器（无需后端支持）获取用户的地理位置技术?2.?精确定位用户的地理位置(?精度最高达10m之内，依赖设备?)?3.?持续追踪用户的地理位置（实时位置）?4.?与?Google Map、或者?Baidu Map?交互呈现位置信息。? HTML5提供Geolocation API,?用于将用户当前地理位置信息共享给信任的站点，这涉及用户的隐私安全问题，所以当一个站点需要获取用户的当前地理位置，浏览器会提示用户是“允许”or “拒绝”。它提供的方法：1、getCurrentPosition?? //当前位置2、watchPosition?????????? //监视位置3、clearWatch?????????????? //清除监视看一下参数：getCurrentPosition(success,error,option)方法最多可以有三个参数：第一个参数是成功获取位置信息的回调函数，它是方法唯一必须的参数；第二个参数用于捕获获取位置信息出错的情况，第三个参数是配置项。看一个例子吧：!DOCTYPE htmlhtmlbodyp id=demo点击这个按钮，获得您的位置：/pbutton onclick=getLocation()试一下/buttondiv id=mapholder/divscript//获取id为demo的标签var x=document.getElementById(demo);//getLocation获取位置的函数，单击是调用function getLocation() { //如果浏览器支持 if (navigator.geolocation) { //获取当前位置，分别传入了成功和失败的两个函数 navigator.geolocation.getCurrentPosition(showPosition,showError); } //如果不支持，则进行提示 else{x.innerHTML=Geolocation is not supported by this browser.;} }//获取成功，调用的函数showPositionfunction showPosition(position) { //获取经度和维度 var latlon=position.coords.latitude+,+position.coords.longitude; //利用谷歌地图进行显示，当然了也可以通过百度地图 var img_url=/maps/api/staticmap?center= +latlon+zoom=14size=400x300sensor=false; document.getElementById(mapholder).innerHTML=img src=+img_url+ /; }//错误调用的函数function showError(error) { switch(error.code) { //错误1 case error.PERMISSION_DENIED: x.innerHTML=User denied the request for Geolocation. break; //地理位置不可用 case error.POSITION_UNAVAILABLE: x.innerHTML=Location information is unavailable. break; //超时 case error.TIMEOUT: x.innerHTML=The request to get user location timed out. break; //位置错误 case error.UNKNOWN_ERROR: x.innerHTML=An unknown error occurred. break; } }/script/body/html?综上为简单的地理定位了解，由于