浏览器支持性检测
浏览器检测是否支持audio元素或者video元素最简单的方式是用脚本动态创建它,然后检测特定函数是否存在。
| var hasVideo = !!(document.createElement('video').canPlayType); |
Geolocation API
html5的Geolocation API(地理定位API),可以请求用户共享他们的位置。使用方法非常简单,如果用户同意,浏览器就会返回位置信息,该位置信息是通过支持html5地理定位功能的底层设备(如笔记本电脑或手机)提供给浏览器的。位置信息由纬度、经度坐标和一些其他元数据组成。
位置信息从何而来
Geolocation API不指定设备使用哪种底层技术来定位应用程序的用户。相反,它只是用于检索位置信息的API,而且通过该API检索到的数据只具有某种程度的准确性,并不能保证设备返回的位置是精确的。设备可以使用下列数据源:
-
IP地址
三维坐标
GPS
从RFID、WiFi和蓝牙到WiFi的MAC地址 GSM或CDMA手机的ID 用户自定义数据
使用方法
| // 一次更新 navigator.geolocation.getCurrentPosition(updateLocation, handleLocationEror); function updateLocation(position) { var latitude = position.coords.latitude; // 纬度 var longitude = position.coords.longitude; // 经度 var accuracy = position.coords.accuracy; // 准确度 var timestamp = position.coords.timestamp; // 时间戳 } // 错误处理函数 function handleLocationEror(error) { .... } // 重复更新 navigator.geolocation.watchPosition(updateLocation, handleLocationEror); // 不再接受位置更新 navigator.geolocation.clearWatch(watchId); |
Communication API
跨文档消息传递
出于安全方面的考虑,运行在同一浏览器中的框架、标签页、窗口间的通信一直都受到了严格的限制。然而,现实中存在一些合理的让不同站点的内容能在浏览器内进行交互的需求。这种情形下,如果浏览器内部能提供直接的通信机制,就能更好地组织这些应用。
html5中引入了一种新功能,跨文档消息通信,可以确保iframe、标签页、窗口间安全地进行跨源通信。postMessage API为发送消息的标准方式,发送消息非常简单:
| window.postMessage('Hello, world', 'http://www.example.com/'); |
接收消息时,仅需在页面中增加一个事件处理函数。当某个消息到达时,通过检查消息的来源来决定是否对这条消息进行处理。
| window.addEventListener("message", messageHandler, true); function messageHandler(e) { switch(e.origin) { case "friend.example.com": // 处理消息 processMessage(e.data); break; default: // 消息来源无法识别 // 消息被忽略 } } |









