html5获取地理位置信息4种方式详解

最新推荐文章于 2024-04-03 08:12:19 发布
最新推荐文章于 2024-04-03 08:12:19 发布
阅读量1.7w 收藏 24
点赞数 1

HTML5怎样获取地理信息，如html5怎样获取ip地址，怎样实现gps导航定位，wifi基站的mac地址服务等，这些在HTML5中已经都已经有API实现了，用户可以轻松使用html5技术进行操作，下面详细为大家介绍HTML5操作地理信息。

1、HTML5中ip地址
其实在中国IP地址还是比较准确，书上说不准确，很多时候获取的是ISP机房的位置，但是获取非常方便，没有什么限制。但是实际上我觉得在中国，ip地址还是比较准确的，基本上上能精确到小区或大楼的标准。

2、HTML5中GPS定位操作

GPS定位非常准确，但是需要在户外，且需要很长时间搜索卫星。但前提就是硬件设备要支持GPS。最主要的很多设备比如笔记本电脑基本都是不带GPS的，新的智能手机purse hanger倒是都有。

3、WiFi基站的mac地址。

（猜测是连接位置已知的公共WiFi的时候，通过Mac地址识别WiFi接入点，从而定位)

这种定位的精度还是很不错的，而且还可以在室内定位。不过由于这种位置公开的wifi比较少，此种方法的适用范围比较少。

4、 GSM或CDMA基站

通过基站定位，精度随基站密度变化，精度一般，还是只有手机能用。看来地理位置API还是手机上比较有实用性。

5、用户指定位置

晕，这个就不是HTML5的范畴了。

地理位置获取流程步骤：

1、用户打开需要获取地理位置的web应用。

2、应用向浏览器请求地理位置，浏览器弹出询问窗口，询问用户是否共享地理位置。

3、假设用户允许，浏览器从设别查询相关信息。

4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。

检测浏览器支持：

JavaScript Code 检测是否支持
function loadDemo() {  
if(navigator.geolocation) {  
document.getElementById(“support”).innerHTML = “HTML5 Geolocation supported.”;  
  
} else {  
document.getElementById(“support”).innerHTML = “HTML5 Geolocation is not supported in  
your browser.”;  
}  
}  
位置请求方式：

单次请求

JavaScript Code

navigator.geolocation.getCurrentPosition(updateLocation, handleLocationError, options);  
回调函数updateLocation接受一个对象参数，表示当前的地理位置，它有如下属性：

latitude——纬度
longitude——精度
accuracy——精确度，单位米
altitude——高度，单位米
altitudeAccuracy——高度的精确地，单位米
heading—运动的方向，相对于正北方向的角度
speed——运动的速度（假设你在地平线上运动），单位米/秒

回调函数handleLocationError接受错误对象，error.code是如下错误号。

UNKNOWN_ERROR (error code 0) —— 错误不在如下三种之内，你可以使用error.message获取错误详细信息。
PERMISSION_DENIED (error code 1)—— 用不选择不共享地理位置
POSITION_UNAVAILABLE (error code 2) ——无法获取当前位置
TIMEOUT (error code 3) ——在指定时间无法获取位置会触发此错误。

第三个参数options是可选参数，属性如下：

enableHighAccuracy——指示浏览器获取高精度的位置，默认为false。当开启后，可能没有任何影响，也可能使浏览器花费更长的时间获取更精确的位置数据。
timeout——指定获取地理位置的超时时间，默认不限时。单位为毫秒。
maximumAge——最长有效期，在重复获取地理位置时，此参数指定多久再次获取位置。默认为0，表示浏览器需要立刻重新计算位置。

参数使用的例子如下：wedding veil

JavaScript Code
navigator.geolocation.getCurrentPosition(updateLocation,handleLocationError, 
  
{timeout:10000});  
重复请求

navigator.geolocation.watchPosition(updateLocation, handleLocationError);
使用 watchPosition可以持续获取地理位置，浏览器或多次调用updateLocation函数以便传递最新的位置。该函数返回一个 watchID，使用navigator.geolocation.clearWatch(watchId)可以清除此次回调，使用不带参数的 navigator.geolocation.clearWatch()清除说有watchPosition。

地址转换：

由于地理位置API返回的是经纬度，如果要计算两个位置之间的距离，可以使用著名的Haversine公式计算两个坐标在地平线上的距离。

Listing 4-7. A JavaScript Haversine implementation

JavaScript Code复制内容到剪贴板
function toRadians(degree) {    
          return degree * Math.PI / 180;    
        }     
        
        function distance(latitude1, longitude1, latitude2, longitude2) {    
          // R is the radius of the earth in kilometers    
    var R = 6371;      
        
          var deltaLatitude = toRadians(latitude2-latitude1);    
    var deltaLongitude = toRadians(longitude2-longitude1);    
          latitude1 =toRadians(latitude1);    
     latitude2 =toRadians(latitude2);     
        
    var a = Math.sin(deltaLatitude/2) *    
    Math.sin(deltaLatitude/2) +    
                  Math.cos(latitude1) *    
                  Math.cos(latitude2) *    
    Math.sin(deltaLongitude/2) *    
    Math.sin(deltaLongitude/2);     
        
          var c = 2 * Math.atan2(Math.sqrt(a),    
    Math.sqrt(1-a));    
          var d = R * c;    
          return d;    
    }

以上是为大家讲解HTML5中基本的操作地理信息，如怎样获取ip，mac地址，gps定位等操作，主要是基本的讲解与了解供大家参考学习。


 

位置信息

在 HTML5 中，当请求一个位置信息时，如果用户同意，浏览器就会返回位置信息，该位置信息是通过支持地理定位功能的底层设备（比如笔记本电脑或手机）提供给浏览器的。位置信息由纬度、经度坐标和一些其他元数据组成。例如北京故宫的位置信息主要由一对纬度和经度坐标组成：纬度：北纬 39.9，经度：东经 116.4。

经纬度坐标有两种表示方式：十进制格式（例如 39.9）和 DMS（Degree Minute Second，角度）格式（例如 39 ° 54 ′ 20 ″）。HTML5 Geolocation API 返回的坐标格式为十进制格式。除了纬度和经度坐标，HTML5 Geolocation 还提供位置坐标的准确度。除此之外，它还会提供其他一些元数据，比如海拔、海拔准确度、行驶方向和速度等，具体情况取决于浏览器所在的硬件设备。

位置信息一般从如下数据源获得：

  • IP 地址
  • 三维坐标
    • GPS（Global Positioning System，全球定位系统）
    • Wi-Fi
    • 手机信号
  • 用户自定义数据

它们各有优缺点如表 1 所示，为了保证更高的准确度，许多设备使用多个数据源组合的方式。

表 1. 位置信息获取方式对比
数据源 优点 缺点
IP 地址 任何地方都可用 
在服务器端处理		 不精确（经常出错，一般精确到城市级）
运算代价大
GPS 很精确 定位时间长，耗电量大 
室内效果差 
需要额外硬件设备支持
Wi-Fi 精确 
可在室内使用 
简单、快捷		 在乡村这些 Wi-Fi 接入点少的地区无法使用
手机信号 相当准确 
可在室内使用 
简单、快捷		 需要能够访问手机或其 modem 设备
用户自定义 可获得比程序定位服务更准确的位置数据 
用户自行输入可能比自动检测更快		 可能很不准确，特别是当用户位置变更后

回页首

浏览器支持情况

各浏览器对 HTML5 Geolocation 的支持程度不同，并且还在不断更新中。好消息是：在 HTML5 的所有功能中，HTML5 Geolocation 是第一批被全部接受和实现的功能之一，相关规范已经达到一个非常成熟的阶段，不大可能做太大改变。如表 2 所示，很多浏览器已经支持 HTML5 Geolocation：

表 2. 浏览器对 HTML5 Geolocation 的支持情况
浏览器 支持情况
Firefox 3.5 及以上版本支持
Chrome 在带有 Gears 的第 2 版 Chrome 中被支持
Internet Explorer 通过 Gears 插件支持
Opera 在版本 10 中支持
Safari 在版本 4 中支持以实现在 iPhone 上可用

由于浏览器对它的支持程度不同，在使用之前最好先检查浏览器是否支持 HTML5 Geolocation API。后面将讲解如何检查浏览器是否支持此功能。本文中所有示例程序都在 Firefox 12.0 上运行测试成功。

adolph_yang
关注
  • 1
    点赞
  • 踩
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML5实现获取地理位置信息并定位功能
09-28
主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5、百度地图、谷歌地图等三种获取理位置信息并定位的方法,需要的朋友可以参考下
html5——获取当前地理位置
The clear water
03-16 1415
使用方法getCurrentPosition()方法获取当前地理位置信息。     在HTML5网页应用中，提供了一组Geolocation API，用来获取用户的地理位置信息。在移动设备中，如果浏览器支持且设置有定位功能，就可以使用这组API定位用户的地理位置。 如果浏览器需要获取用户当前的地理位置信息，需要通过API访问window.navigator对象中新添加的geolocat
h5地理位置获取与多媒体，附大厂真题面经
最新发布
2401_84093860的博客
04-03 684
今天的文章可谓是积蓄了我这几年来的应聘和面试经历总结出来的经验，干货满满呀！如果你能够一直坚持看到这儿，那么首先我还是十分佩服你的毅力的。所以看完之后，还是多多行动起来吧！可以非常负责地说，如果你能够坚持把我上面列举的内容都一个不拉地看完并且全部消化为自己的知识的话，那么你就至少已经达到了中级开发工程师以上的水平，进入大厂技术这块是基本没有什么问题的了。所以看完之后，还是多多行动起来吧！
html5获取当前地理位置
09-12
html5获取当前地理位置
html5中获取地理位置信息,HTML5实现获取地理位置信息并定位功能_html5教程技巧...
weixin_35545782的博客
06-04 728
这篇文章主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5、百度地图、谷歌地图等三种获取理位置信息并定位的方法,需要的朋友可以参考下HTML5提供了地理位置定位功能(Geolocation API)，能确定用户位置，我们可以借助HTML5的该特性开发基于地理位置信息的应用。本文结合实例给大家分享如何使用HTML5，借助百度、谷歌地图接口来获取用户准确的地理位置信息。jmc...
【前端用法】html5实现地理位置定位（JS获取当前地理位置的方法）
热门推荐
No8g攻城狮的博客
03-03 2万+
目前在做公司的一个网站，有个需求是：当别人进入网站时自动定位他的地理位置，包括市区，方便给他推荐当前城市的特色信息。 其实，这也是一个非常实用的功能，在网上搜到很多，有的不能用，现将我整理的两个能用的记录一下，以便后续再使用。 方案1： <!DOCTYPE html> <html lang="en"> <head> <meta http-e......
HTML5获取地理位置定位信息
weixin_52546522的博客
03-23 573
使用HTML5获取地理位置定位信息 如何使用HTML5地理位置定位功能 定位功能(Geolocation)是HTML5的新特性，因此只有在支持HTML5的现代浏览器上运行，特别是手持设备如iphone，地理定位更加精确。首先我们要检测用户设备浏览器是否支持地理定位，如果支持则获取地理信息。注意这个特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的，所以我们在访问该应用时会提示是否允许地理定位，我们当然选择允许即可。 function getLocation(){ 　　if (navigator
HTML5 定位
xiangxiongfly
12-28 1484
在HTML5中，可以使用geolocation对象来获取用户的地理位置信息。语法//简写为geolocation对象的方法方法说明获取当前位置监听位置取消监听。
HTML5获取地址位置
凯尔斯基的专栏
11-13 6048
通过HTML5的geolocation来获取地理位置，但要注意的是这里获取的原始坐标，直接用该坐标在百度地图上显示不准确，需要进行转换。   一、用HTML5的geolocation获取原始地址 &lt;script type="text/javascript"&gt; function getLocation(){   if (navigator.geolocation){   ...
HTML5 地理定位
robert198837的专栏
12-21 548
点击这个按钮，获得您的位置： 试一下 var x=document.getElementById("demo"); function getLocation()   {   if (navigator.geolocation)     {     navigator.geolocation.getCurrentPosition(showPosition,showError
从入门到精通HTML5——PDF——网盘链接
02-27
第1篇 HTML基础 　　第1章 HTML基础 3 　　教学录像：22分钟 　　1.1 HTML的基本概念 4 　　1.2 HTML发展史 4 　　1.3 HTML的基本结构 5 　　1.3.1 HTML文件的编写方法 5 　　1.3.2 文件开始标签<html> 7 　　1.3.3 文件头部标签<head> 7 　　1.3.4 文件标题标签<title> 7 　　1.3.5 文件主体标签<body> 7 　　1.3.6 编写文件的注意事项 8 　　1.4 编写第一个HTML文件 8 　　1.4.1 HTML文件的编写方法 8 　　1.4.2 手工编写页面 9 　　1.4.3 使用可视化软件制作页面 10 　　1.4.4 使用浏览器浏览HTML文件 14 　　1.4.5 使用HTML开发的明日图书网 14 　　1.5 小结 15 　　1.6 习题 16 　　第2章 HTML文件基本标记 17 　　教学录像：44分钟 　　2.1 HTML头部标记 18 　　2.2 标题标记<title> 18 　　2.3 元信息标记<meta> 19 　　2.3.1 设置页面关键字 19 　　2.3.2 设置页面描述 20 　　2.3.3 设置编辑工具 20 　　2.3.4 设定作者信息 21 　　2.3.5 限制搜索方式 22 　　2.3.6 设置网页文字及语言 22 　　2.3.7 设置网页的定时跳转 23 　　2.3.8 设定有效期限 24 　　2.3.9 禁止从缓存中调用 24 　　2.3.10 删除过期的cookie 25 　　2.3.11 强制打开新窗口 25 　　2.3.12 设置网页的过渡效果 26 　　2.4 基底网址标记<base> 29 　　2.5 页面的主体标记<body> 30 　　2.5.1 设置文字颜色——text 31 　　2.5.2 背景颜色属性——bgcolor 32 　　2.5.3 背景图像属性——background 32 　　2.5.4 设置链接文字属性——link 35 　　2.5.5 设置边距——margin 37 　　2.6 页面的注释标记 38 　　2.7 实例演练——创建基本的HTML网页 38 　　2.8 小结 39 　　2.9 习题 40 　　第3章 设计网页文本内容 41 　　教学录像：29分钟 　　3.1 标题文字的建立 42 　　3.1.1 标题文字标记<h> 42 　　3.1.2 标题文字的对齐方式——align 43 　　3.2 设置文字格式 44 　　3.2.1 设置文字字体——face 44 　　3.2.2 设置字号——size 45 　　3.2.3 设置文字颜色——color 46 　　3.2.4 粗体、斜体、下划线——strong、em、u 46 　　3.2.5 上标与下标——sup、sub 47 　　3.2.6 设置删除线——strike 48 　　3.2.7 等宽文字标记——code 49 　　3.2.8 空格——&nbsp; 49 　　3.2.9 其他特殊符号 50 　　3.3 设置段落格式 51 　　3.3.1 段落标记——p 51 　　3.3.2 取消文字换行标记——nobr 52 　　3.3.3 换行标记——br 53 　　3.3.4 保留原始排版方式标记——pre 53 　　3.3.5 居中对齐标记——center 54 　　3.3.6 向右缩进标记——blockquote 55 　　3.4 水平线标记 56 　　3.4.1 添加水平线——hr 56 　　3.4.2 设置水平线的宽度与高度 　　——width、height 57 　　3.4.3 设置水平线的颜色——color 58 　　3.4.4 设置水平线的对齐方式——align 59 　　3.4.5 去掉水平线阴影——noshade 60 　　3.5 其他文字标记 60 　　3.5.1 文字标注标记——ruby 60 　　3.5.2 声明变量标记——var 61 　　3.5.3 忽视HTML标记 　　——plaintext、xmp 62 　　3.6 小结 63 　　3.7 习题 63 　　第4章 使用列表 65 　　教学录像：35分钟 　　4.1 列表的标记 66 　　4.2 使用无序列表 66 　　4.2.1 无序列表标记——ul 66 　　4.2.2 无序列表的符号类型——type 67 　　4.3 使用有序列表 69 　　4.3.1　有序列表标记——ol 69 　　4.3.2　有序列表的属性——type 70 　　4.3.3　有序列表的起始数值——start 72 　　4.4 定义列表标记——dl 73 　　4.5 菜单列表标记——menu 74 　　4.6 目录列表——dir 75 　　4.7 使用嵌套列表 76 　　4.7.1　定义列表的嵌套 77 　　4.7.2　无序列表和有序列表的嵌套 78 　　4.8 小结 79 　　4.9 习题 80 　　第5章 超链接 81 　　教学录像：22分钟 　　5.1 超链接的基本知识 82 　　5.1.1 超链接 82 　　5.1.2 绝对路径 82 　　5.1.3 相对路径 82 　　5.2 超链接的建立 83 　　5.2.1 超链接标记的基本语法 83 　　5.2.2 建立文本超链接 83 　　5.2.3 设置超链接的目标窗口 85 　　5.3 内部链接 87 　　5.4 书签链接 89 　　5.4.1 建立书签 89 　　5.4.2 链接到同一页面的书签 91 　　5.4.3 链接到不同页面的书签 92 　　5.5 外部链接 93 　　5.5.1 通过HTTP协议 94 　　5.5.2 通过FTP 94 　　5.5.3 发送E-mail 95 　　5.5.4 下载文件 96 　　5.6 其他链接 98 　　5.6.1 脚本链接 98 　　5.6.2 空链接 99 　　5.7 小结 99 　　5.8 习题 100 　　第6章 使用图像 101 　　教学录像：35分钟 　　6.1 图像的基本格式 102 　　6.2 添加图像——img 102 　　6.3 设置图像属性 103 　　6.3.1 图像高度——height 103 　　6.3.2 图像宽度——width 104 　　6.3.3 图像边框——border 105 　　6.3.4 图像水平间距——hspace 107 　　6.3.5 图像垂直间距——vspace 108 　　6.3.6 图像相对于文字基准线的对齐方式 　　——align 108 　　6.3.7 图像的提示文字——alt 110 　　6.4 图像的超链接 111 　　6.4.1　设置图像的超链接 111 　　6.4.2　设置图像热区链接 112 　　6.5 小结 116 　　6.6 习题 116 　　第7章 表格的应用 118 　　教学录像：48分钟 　　7.1　创建表格 119 　　7.1.1　表格的基本构成——table、tr、td 119 　　7.1.2　表格的标题——caption 120 　　7.1.3　表格的表头——th 121 　　7.2　设置表格基本属性 123 　　7.2.1　表格的宽度——width 123 　　7.2.2　表格的高度——height 125 　　7.2.3　表格的对齐方式——align 126 　　7.3　设置表格的边框 127 　　7.3.1　表格边框的宽度——border 127 　　7.3.2　表格边框的颜色——bordercolor 128 　　7.3.3　表格内框的宽度——cellspacing 130 　　7.3.4　表格内文字与边框的间距 　　——cellpadding 131 　　7.4　设置表格背景 132 　　7.4.1　表格的背景颜色——bgcolor 132 　　7.4.2　表格的背景图像——background 133 　　7.5　设置表格的行属性 134 　　7.5.1　高度的控制——height 134 　　7.5.2　行的边框颜色——bordercolor 135 　　7.5.3　行的背景颜色——bgcolor、background 136 　　7.5.4　行文字的水平对齐方式——align 137 　　7.5.5　行文字的垂直对齐方式——valign 139 　　7.5.6 表格标题的垂直对齐方式——align 140 　　7.6　调整单元格属性 141 　　7.6.1　单元格大小——width、height 141 　　7.6.2　单元格水平跨度——colspan 142 　　7.6.3　单元格垂直跨度——rowspan 143 　　7.6.4　单元格对齐方式——align、valign 144 　　7.6.5　单元格的背景色 146 　　7.6.6　单元格的边框颜色——bordercolor 147 　　7.6.7　单元格的亮边框——bordercolorlight 148 　　7.6.8　单元格的暗边框——bordercolordark 150 　　7.6.9　单元格的背景图像——background 151 　　7.7　表格的结构 152 　　7.7.1　表格的表头标记——thead 153 　　7.7.2　表格的表主体标记——tbody 154 　　7.7.3　表格的表尾标记——tfoot 156 　　7.8 表格的嵌套 157 　　7.9 小结 159 　　7.10 习题 159 　　第8章 层标记——div 161 　　教学录像：33分钟 　　8.1 层 162 　　8.1.1 层的分类 162 　　8.1.2 定义数据块 162 　　8.2 <div>标签 163 　　8.2.1 <div>标签的简介 163 　　8.2.2 <div>标签的属性 164 　　8.2.3 <span>标签与<div>标签 170 　　8.3 <iframe>标签 172 　　8.3.1 <iframe>标签的简介 172 　　8.3.2 <iframe>标签的属性 172 　　8.4 <layer>标签和<ilayer>标签 174 　　8.4.1 标签层的使用 175 　　8.4.2 <layer>标签和<ilayer>标签的区别 176 　　8.5 应用div制作下拉菜单导航条 176 　　8.6 小结 179 　　8.7 习题 179 　　第9章 编辑表单 181 　　教学录像：26分钟 　　9.1　使用表单标签——form 182 　　9.1.1　处理动作——action 182 　　9.1.2　表单名称——name 183 　　9.1.3　传送方法——method 183 　　9.1.4　编码方式——enctype 184 　　9.1.5　目标显示方式——target 185 　　9.2 添加控件 185 　　9.3　输入类的控件 186 　　9.3.1　文字字段——text 186 　　9.3.2　密码域——password 187 　　9.3.3　单选按钮——radio 188 　　9.3.4　复选框——checkbox 189 　　9.3.5　普通按钮——button 190 　　9.3.6　提交按钮——submit 191 　　9.3.7　重置按钮——reset 192 　　9.3.8　图像域——image 193 　　9.3.9　隐藏域——hidden 195 　　9.3.10　文件域——file 195 　　9.4　列表/菜单标记 197 　　9.5　文本域标记——textarea 198 　　9.6　id标记 199 　　9.7　小结 200 　　9.8　习题 200 　　第10章 多媒体页面 202 　　视频讲解：18分钟 　　10.1 设置滚动文字 203 　　10.1.1 滚动文字标签——marquee 203 　　10.1.2 滚动方向属性——direction 203 　　10.1.3 滚动方式属性——behavior 204 　　10.1.4 滚动速度属性——scrollamount 205 　　10.1.5 滚动延迟属性——scrolldelay 206 　　10.1.6 滚动循环属性——loop 207 　　10.1.7 滚动范围属性——width、height 208 　　10.1.8 滚动背景颜色属性——bgcolor 209 　　10.1.9 滚动空间属性——hspace、vspace 209 　　10.2 添加背景音乐 211 　　10.2.1　设置背景音乐——bgsound 211 　　10.2.2　设置循环播放次数——loop 212 　　10.3 添加多媒体文件 213 　　10.3.1 添加多媒体文件标记——embed 213 　　10.3.2 设置自动运行——autostart 214 　　10.3.3 设置媒体文件的循环播放——loop 215 　　10.3.4 隐藏面板——hidden 216 　　10.3.5 添加其他类型的媒体文件 217 　　10.4 小结 217 　　10.5 习题 218 　　第2篇 HTML 5高级应用 　　第11章 HTML 5的新特性 221 　　视频讲解：6分钟 　　11.1 谁在开发HTML 5 222 　　11.2 HTML 5的新认识 222 　　11.2.1 兼容性 222 　　11.2.2 实用性和用户优先 222 　　11.2.3 化繁为简 223 　　11.3 无插件范式 223 　　11.4 HTML 5的新特性 224 　　11.5 小结 224 　　第12章 HTML 5与HTML 4的区别 225 　　视频讲解：51分钟 　　12.1 语法的改变 226 　　12.1.1 HTML 5的语法变化 226 　　12.1.2 HTML 5中的标记方法 226 　　12.1.3 HTML 5语法中的3个要点 227 　　12.1.4 标签实例 228 　　12.2 新增的元素和废除的元素 228 　　12.2.1 新增的结构元素 228 　　12.2.2 新增的块级的语义元素 230 　　12.2.3 新增的行内的语义元素 231 　　12.2.4 新增的嵌入多媒体元素与交互性元素 231 　　12.2.5 新增的input元素的类型 232 　　12.2.6 废除的元素 233 　　12.3 新增的属性和废除的属性 234 　　12.3.1 新增的属性 234 　　12.3.2 废除的属性 236 　　12.4 全局属性 237 　　12.4.1 contentEditable属性 237 　　12.4.2 designMode属性 238 　　12.4.3 hidden属性 239 　　12.4.4 spellcheck属性 239 　　12.4.5 tabindex属性 240 　　12.5 小结 240 　　12.6 习题 240 　　第13章 HTML 5的结构 242 　　视频讲解：20分钟 　　13.1 新增的主体结构元素 243 　　13.1.1 article元素 243 　　13.1.2 section元素 245 　　13.1.3 nav元素 247 　　13.1.4 aside元素 248 　　13.1.5 time元素 250 　　13.1.6 pubdate属性 250 　　13.2 新增的非主体结构元素 251 　　13.2.1 header元素 251 　　13.2.2 hgroup元素 252 　　13.2.3 footer元素 252 　　13.2.4 address元素 253 　　13.3 小结 253 　　13.4 习题 254 　　第14章 HTML 5中的表单 255 　　视频讲解：50分钟 　　14.1 新增表单元素与属性 256 　　14.1.1 新增的属性 256 　　14.1.2 增加与改良的input元素的种类 259 　　14.1.3 output元素的添加 264 　　14.1.4 应用新增元素制作注册表单 264 　　14.2 对表单的验证 266 　　14.2.1 自动验证 266 　　14.2.2 checkValidity显式验证法 267 　　14.2.3 避免验证 268 　　14.2.4 使用setCustomValidity方法自定义 　　错误信息 268 　　14.3 增加的页面元素 269 　　14.3.1 新增的figure元素 270 　　14.3.2 新增的details元素 271 　　14.3.3 新增的mark元素 272 　　14.3.4 新增的progress元素 274 　　14.3.5 新增的meter元素 275 　　14.3.6 改良的ol列表 276 　　14.3.7 改良的dl列表 276 　　14.3.8 加以严格限制的cite元素 277 　　14.3.9 重新定义的small元素 278 　　14.4 小结 278 　　14.5 习题 279 　　第15章 HTML 5中的文件与拖放 280 　　视频讲解：40分钟 　　15.1 选择文件 281 　　15.1.1 通过file对象选择文件 281 　　15.1.2 使用blob接口获取文件的类型与大小 282 　　15.1.3 通过类型过滤选择的文件 283 　　15.2　使用FileReader接口读取文件 285 　　15.2.1 检测浏览器是否支持FileReader接口 285 　　15.2.2　FileReader接口的方法 285 　　15.2.3 使用readAsDataURL方法预览图片 286 　　15.2.4　使用readAsText方法读取文本文件 287 　　15.2.5　FileReader接口中的事件 288 　　15.3 拖放API 290 　　15.3.1 实现拖放的步骤 290 　　15.3.2 通过拖放显示欢迎信息 291 　　15.4 dataTransfer对象应用详解 293 　　15.4.1 使用effectAllowed和dropEffect属性 　　设置拖放效果 293 　　15.4.2 使用setDragImage方法设置拖放图标 294 　　15.5 小结 295 　　15.6 习题 295 　　第16章 多媒体播放 296 　　视频讲解：35分钟 　　16.1 HTML 5多媒体的简述 297 　　16.1.1 HTML 4中多媒体的应用 297 　　16.1.2 HTML 5页面中的多媒体 297 　　16.2 多媒体元素基本属性 298 　　16.3 多媒体元素常用方法 302 　　16.3.1 媒体播放时的方法 302 　　16.3.2 canPlayType(type)方法 304 　　16.4 多媒体元素重要事件 304 　　16.4.1 事件处理方式 304 　　16.4.2 事件介绍 305 　　16.4.3 事件实例 306 　　16.5 小结 308 　　16.6 习题 309 　　第17章 绘制图形 310 　　视频讲解：1小时32分钟 　　17.1 canvas的基础知识 311 　　17.1.1 canvas是什么 311 　　17.1.2 在页面中放置canvas元素 311 　　17.1.3 绘制带边框的矩形 312 　　17.2 在画布中使用路径 314 　　17.2.1 使用arc方法绘制圆形 314 　　17.2.2 使用moveTo与lineTo路径绘制火柴人 316 　　17.2.3 贝塞尔和二次方曲线 317 　　17.3 运用样式与颜色 319 　　17.3.1 fillStyle 和 strokeStyle属性 319 　　17.3.2 透明度 globalAlpha 321 　　17.3.3 线型 Line styles 323 　　17.4 绘制渐变图形 325 　　17.4.1 绘制线性渐变 325 　　17.4.2 绘制径向渐变 326 　　17.5 绘制变形图形 328 　　17.5.1 坐标的变换 328 　　17.5.2 矩阵变换 330 　　17.6 组合多个图形 333 　　17.7 给图形绘制阴影 335 　　17.8 应用图像 336 　　17.8.1 绘制图像 336 　　17.8.2 图像的局部放大 338 　　17.8.3 图像平铺 339 　　17.8.4 图像裁剪 341 　　17.8.5 像素的处理 342 　　17.9 绘制文字 344 　　17.10 保存与恢复状态 345 　　17.11 文件的保存 346 　　17.12 对画布绘制实现动画 347 　　17.13 综合实例——桌面时钟 348 　　17.14 小结 350 　　17.15 习题 351 　　第18章 数据存储 352 　　视频讲解：50分钟 　　18.1 初识Web Storage 353 　　18.1.1 什么是Web Storage 353 　　18.1.2 使用Web Storage中的API 353 　　18.1.3 sessionStorage和localStorage的实例 　　——计数器 355 　　18.1.4 Web Storage综合实例——留言本 357 　　18.1.5 JSON对象的存数实例——用户信息卡 359 　　18.2 本地数据库 361 　　18.2.1 Web SQL数据库简介 361 　　18.2.2 使用Web SQL Database API 362 　　18.2.3 本地数据库实例——用户登录 363 　　18.3 小结 367 　　18.4 习题 367 　　第19章 离线应用程序 368 　　视频讲解：13分钟 　　19.1 HTML 5离线Web应用概述 369 　　19.1.1 离线Web应用概述 369 　　19.1.2 本地缓存与浏览器网页缓存的区别 370 　　19.2 创建HTML 5离线应用 370 　　19.2.1 缓存清单（manifest） 370 　　19.2.2 配置IIS服务器 372 　　19.2.3 浏览缓存清单 372 　　19.3 浏览器与服务器的交互过程 373 　　19.4 applicationCache对象 374 　　19.4.1 swapCache方法 375 　　19.4.2 applicationCache对象的事件 376 　　19.5 小结 379 　　19.6 习题 379 　　第20章 使用Web Worker处理线程 380 　　视频讲解：25分钟 　　20.1 Web Worker概述 381 　　20.1.1 创建和使用Worker 381 　　20.1.2 Web Worker应用实例——求和运算 382 　　20.2 在Worker内部能做什么 383 　　20.3 多个JavaScript文件的加载与执行 384 　　20.4 线程嵌套 384 　　20.4.1 单层嵌套 385 　　20.4.2 在多个子线程中进行数据的交互 387 　　20.5 小结 390 　　20.6 习题 390 　　第21章 通信API 391 　　视频讲解：4分钟 　　21.1 跨文档消息通信 392 　　21.1.1 使用postMessageAPI 392 　　21.1.2 跨文档消息传输 392 　　21.2 小结 394 　　第22章 获取地理位置信息 395 　　视频讲解：12分钟 　　22.1 Geolocation API的概述 396 　　22.1.1 使用getCurrentPosition方法获取 　　当前地理位置 396 　　22.1.2 持续监视当前地理位置的信息 398 　　22.1.3 停止获取当前用户的地理位置信息 398 　　22.2 position对象 398 　　22.3 在google地图上显示“我在这里” 399 　　22.4 小结 401 　　22.5 习题 401 　　第3篇 HTML 5项目实战 　　第23章 旅游信息网前台页面 405 　　视频讲解：20分钟 　　23.1 概述 406 　　23.2 网站预览 406 　　23.3 关键技术 410 　　23.3.1 网站主体结构设计 410 　　23.3.2 HTML 5结构元素的使用 410 　　23.4 网站公共部分设计 411 　　23.4.1 设计网站公共header 411 　　23.4.2 设计网站公共footer 418 　　23.5 网站主页设计 419 　　23.5.1 显示网站介绍及相关图片 419 　　23.5.2 主页左侧导航的实现 421 　　23.6 留下足迹页面设计 424 　　23.6.1 播放音乐 424 　　23.6.2 添加留言功能的实现 425 　　23.7 小结 426 　　附录 习题参考答案 427 　　HTML 5从入门到精通 　　目 录 　　X 　　XI
Google Android SDK开发范例大全(第3版) 4/5
01-20
基本信息 Google Android SDK开发范例大全（第3版） 作者：王世江(改编), 佘志龙(作者), 陈昱勋(作者), 郑名杰(作者), 等(作者) 出版社: 人民邮电出版社; 第3版 (2011年11月1日) 丛书名: 移动开发系列丛书 平装: 818页 正文语种: 简体中文 开本: 16 ISBN: 9787115264305 条形码: 9787115264305 商品尺寸: 26 x 18.4 x 3.8 cm 商品重量: 1.3 Kg 编辑本段 内容简介 《Google Android SDK开发范例大全(第3版)》在上一版的基础上，以Android手机应用程序开发（采用Android SDK 2.3.3）为主题，超过200多个范例全面且深度地整合了手机、网络及服务等多个开发领域，为读者提高程序设计能力提供了很大的帮助。 全书共分11章，主要以范例集的方式来讲述Android的知识点，详细介绍了开发Android的人机交互界面、Android常用的开发控件、Android手机收发短信等通信服务、开发Android手机的自动服务功能和娱乐多媒体功能以及整合Android与Google强大的网络服务等内容。随书光盘中包括了所有范例的程序代码。 《Google Android SDK开发范例大全(第3版)》继承前两版由浅入深的方式，范例总数由原先的160多个增加到了200多个，在用户交互界面、手机控件、交互式通信服务、手机自助服务、娱乐多媒体等方面均增加了相应的范例来介绍新的开发技术，特别是新增加了第11章来专门介绍HTML5技术在Android移动设备里的应用，相信当下两个热门技术的交汇会碰撞出不一样的火花。 《Google Android SDK开发范例大全(第3版)》内容由Android的基础知识到实际开发应用，结构清晰、语言简洁，非常适合Android的初学者和Android的进阶程序开发者阅读参考。 编辑本段 编辑推荐 《Google Android SDK开发范例大全(第3版)》：全新2.3以上版本精彩范例。新增HTML5手机应用程序范例。影音功能大突破，领先业界的影音播放功能详解。易于阅读的架构设计，边看边学，每个范例均搭配步骤及完成画面。每个范例后面均有扩展学习，在学习范例应用的同时延伸思考。汲取专家经验，指引入门捷径。 移动网络设备（MID，Mobile Internet Device）的发展趋势锐不可当，其中以智能手机最受瞩目。 《Google Android SDK开发范例大全(第3版)》采用范例集的形式，由浅入深地带领Google Android SDK初学者，以及具备Java基础的程序设计人员逐步掌握开发MID的能力。同时，书中200多个范例均可作为开发样板，以此抛砖引玉，进而拓展程序设计人员开发MID的无限可能。精彩范例，原创展现。 更炫的移动设备人机界面配置：豪华Widget、Home Screen App Widgets、隐藏式抽屉-Sliding Drawer等闪亮登场！ 完整的手机数据存取功能：铃声模式设置、震动控制、WiFi服务、屏幕旋转、电池计量、温度测量、电信网络信息、SIM卡信息、拨打电话、短信解析、通讯录联系人、电子罗盘、屏幕手写等手机控制功能。 系统服务及研发的整合：网络搜索、联系人、音乐、应用程序、定制手机文件管理、记忆卡I/O存取、双向短信、闹钟服务、开机程序、来电通信互动、拜年短信、信息提醒、电池电量显示、进度显示、取得应用程序信息等。 超酷的娱乐多媒体设计：触控移动事件、建立手势、手势判断控制、屏幕保护程序、启动动画、mp3播放器、3gp影片播放、相机预览拍照、自动对焦、调整音量、信息指令遥控手机、录音控制、自定义动画按钮等 Web Service存取服务：内嵌网页浏览器、Ajax网页特效、手机气象局、网络播放mp3、网络安装apk程序、远程下载手机铃声、XML-RPC移动博客发布器、手机RSS阅读器、地震速报、网页快照等。 完备的Google网络服务：Google语音搜寻、Google远程账号登录、Google Search API、Google Chart API、Google Picasa手机相册、Google Translate API整合等。 Google Map应用：GPS定位、规划导航路径、GPS Google地图、地址反查地理坐标等卫星全球定位实例。 创意程序设计：即时动态桌面、电蚊香、转转轮盘、任务管理器、中英发音字典、手机手电筒、GPS轨迹记录器、女性贴身计时、QR Code二维条码生成器、手机OR Code扫描仪、热量骰子、掷杯筊、正妹墙相簿浏览器、You Tube影片FLV文件下载器等。 HTML5结合Mobile:控制手机
详解用Python爬虫获取百度企业信用中企业基本信息
12-17
一、背景 希望根据企业名称查询其经纬度，所在的省份、城市等信息。直接将企业名称传给百度地图提供的API，得到的经纬度是非常不准确的，因此希望获取企业完整的地理位置，这样传给API后结果会更加准确。 百度企业信用提供了企业基本信息查询的功能。希望通过Python爬虫获取企业基本信息。目前已基本实现了这一需求。 本文最后会提供具体的代码。代码仅供学习参考，希望不要恶意爬取数据！ 二、分析 以苏宁为例。输入“江苏苏宁”后，查询结果如下： 经过分析，这里列示的企业信息是用JavaScript动态生成的。服务器最初传过来的未经渲染的HTML如下： 注意其中标注出来的JS代码。有意思的是，企业
HTML, XHTML, and CSS Bible, 5th Edition.pdf
03-09
HTML5 开发精要与实例详解，清晰，带标签版本 内容分为两大部分：第一部分通过一系列中大型案例全方位对html 5的各个重要知识点进行了详细的讲解，每个案例包含案例概述、页面效果展示、案例所涉及主要知识点（精要）、源代码剖析4个部分，读者既能根据书中的步骤动手实践，又能重点学习案例中用到的核心理论知识，同时还能领会源代码的设计思路和方法；第二部分讲解了jwebsocket、rgraph、webgl等3个重要框架和技术的详细使用方法。 《html 5开发精要与实例详解》一共12章：第1章分别用2个案例演示了如何利用html 5中的结构元素来构建一个博客网站和企业门户网站；第2章用2个案例讲解了表单在html 5中的使用；第3章用6个案例讲解了如何利用canvas元素来绘制图形、图像和制作动画；第4章用2个案例介绍了文件apt和拖放api的使用方法； 第5章用4个案例讲解了如何打造自己的网页视频播放器、网页音频播放器，以及实现视频实时回放和视频截图等多媒体功能；第6章用6个案例全面讲解了html 5中的本地存储技术；第7章用单点登录和获取批量数据这2个案例讲解了html 5中的跨文档的消息传输技术；第8章用2个案例讲解了如何利用web workers实现多线程处理；第9章用1个案例讲解了如何利用geolocation api来获取地理位置信息；第10~13章分别讲解了socket通信框架jwebsocket、统计图制作插件rgraph、三维web开发技术webgl的详细使用方法，并辅之以丰富的案例。 《html 5开发精要与实例详解》所有案例的源代码都是作者亲自编写并调试和运行成功的。读者可以利用这些代码进行实战练习，也可以根据需要对这些代码进行修改，以观察不同的效果，从而加深对案例代码和书中知识点的理解。
html5定位获取当前位置并在百度地图上显示
05-09
html5定位获取当前位置并在百度地图上显示，同时显示定位的经纬坐标与详细地址信息！
HTML5开发精要与实例详解（完整版源代码含说明文档）
02-26
第9章用1个案例讲解了如何利用geolocation api来获取地理位置信息；第10~13章分别讲解了socket通信框架jwebsocket、统计图制作插件rgraph、三维web开发技术webgl的详细使用方法，并辅之以丰富的案例。 《html 5开发...
H5 navigator.geolocation 获取定位
qq_43592892的博客
01-31 532
navigator.geolocation 有三个方法：getCurrentPosition(), watchPosition(), clearWatch()
html5自动定位
飞一样的编程
07-21 3867
自动定位需要ak(密钥)，首先得有百度账号。如何申请密钥 http://www.tuicool.com/articles/2MbMjy 如何定位，转载：http://www.helloweba.com/view-blog-300.html HTML5提供了地理位置定位功能（Geolocation API），能确定用户位置，我们可以借助HTML5的该特性开发基于地理位置信息的应用。本文结合实例给
ios 获取html的高度,iOS Webview自适应实际内容高度的4种方法详解
06-09
下面是四种方法，可以根据具体情况选择使用哪种方法： 方法一：使用JavaScript代码获取HTML实际内容的高度 ``` NSString *jsString = @"document.documentElement.scrollHeight"; CGFloat height = [[webView ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值