h5新增属性
一、地理位置
百度地图的JavaScript API接口：http://lbsyun.baidu.com/index.php?title=jspopular
demo接口 网址 http://lbsyun.baidu.com/index.php?title=jspopular
获取地理定位的
// 地理定位获取使用方法 // 方法：可以获取位置 // window.navigator.geolocation.getCurrentPosition(成功的函数，失败的函数);
地理定位的两个属性：
position.coords.latitude//纬度
position.coords.longitude//经度
下面例子是地理位置的使用方式：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>地理定位</title> </head> <body> <script> // 地理定位 // 方法：可以获取位置 // window.navigator.geolocation.getCurrentPosition(成功的函数，失败的函数); /* 参数1：函数：定位成功后就执行 参数2： 函数：定位失败后执行
有时间获取不到地理位置 */ window.navigator.geolocation.getCurrentPosition(function (position) { // 如果获取定位成功，则打印一个对象 console.log(position); console.log(position.coords.latitude);//打印出当前的维度 console.log(position.coords.longitude);//经度 // 如果获取到经纬度，就可以获取位置 },function(msg){ // 无法获取，此时执行的是这个 console.log(msg);//如果定位失败，请打印失败的相关信息 }); </script> </body> </html>
通过百度地图的JavaScript---API去获取接口 查看百度地图的demo，如下获取百度地图以及当前个人的位置：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<!-- <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
<!-- 在你的密钥处，填写在百度地图中申请的私钥 -->
<title>设置点的新图标</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 地理定位
window.navigator.geolocation.getCurrentPosition(function (position) {
var lat = position.coords.latitude();//纬度
var lon = position.coords.longitude();//经度
// 百度地图API功能
var map = new BMap.Map("allmap");
// 经纬度---地图中的经纬度
var point = new BMap.Point(lon, lat);
map.centerAndZoom(point, 15);
//创建小狐狸
var pt = new BMap.Point(lon, lat);//小狐狸的经纬度
var myIcon = new BMap.Icon("http://lbsyun.baidu.com/jsdemo/img/fox.gif", new BMap.Size(300,157));
var marker2 = new BMap.Marker(pt,{icon:myIcon}); // 创建标注
map.addOverlay(marker2); // 将标注添加到地图中
},function (msg) {
console.log(msg);
});
</script>
更多效果，，百度地图的JavaScript API接口： 网址 http://lbsyun.baidu.com/index.php?title=jspopular （需要把经纬度换下即可实现效果）
// 获取实时地理信息
window.navigator.geolocation.watchPosition(function (position) {
// 成功时执行
console.log(position.coords.accuracy);//精确位置
var aa = position.coords.accuracy;//精确位置
},function(msg) {
// 失败时执行
console.log(msg);
});
本地存储 （localStorage，sessionStorage）、cookie（浏览器）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>本地存储</title>
</head>
<body>
<script>
// sessionStorage
/*设置值：属性名字和值*/
window.sessionStorage.setItem('name','lxs');
window.sessionStorage.setItem('age','222');
// 数据已经存储
// 获取数据:出入属性名字，得到该属性的值
var name = window.sessionStorage.getItem('name');
var age = window.sessionStorage.getItem('age');
console.log(name+','+age);
window.sessionStorage.removeItem('age');
// 数据共享：同一个窗口数据共享
// 清空数据
window.sessionStorage.clear();
</script>
</body>
</html>
//给键，通过 removeItem移除这个键对应的值
window.sessionStorage.removeItem('age');
localstorage的用法与sessionStorage一样
