那些牛掰的 HTML5的API(二)

1:视频播放器

2:地理定位css

  咱们的支持html5 的浏览器给咱们提供一个接口(api),能够用来获取你当前的位置.html

  主要是经过geolocation(地理位置),对象 ,去访问硬件,来获取到经纬度..html5

1  if (navigator.geolocation){
2    navigator.geolocation.getCurrentPosition(showPosition);
3  } else{
4   x.innerHTML="Geolocation is not supported by this browser.";}
5  }

   咱们获取到的是一个经纬度。咱们调用地图。咱们调用百度地图.(街景地图)web

3: 拖拽
html5 里面支持拖拽
  1)当前拖拽的元素
    ondrag 应用于拖拽元素,整个拖拽过程都会调用
    ondragstart 应用于拖拽元素,当拖拽开始时调用
    ondragleave 应用于拖拽元素,当鼠标离开拖拽元素时调用
    ondragend 应用于拖拽元素,当拖拽结束时调用
  2)目标元素
    ondragenter 应用于目标元素,当拖拽元素进入时调用
    ondragover 应用于目标元素,当停留在目标元素上时调用
    ondrop 应用于目标元素,当在目标元素上松开鼠标时调用
    ondragleave 应用于目标元素,当鼠标离开目标元素时调用

4: web 存储
  咱们经过sessionStorage 和 localStorage 这两个对象能够向本地保存数据。api

1 setItem(key,value)
2 getItem();
3 removeItem();
4 clear();

  经过这个对象sessionStorage 演示了这四个方法. (设计到数据的操做就是增删改查..)
localStorage 保存数据 ;方法的同样的
sessionStorage 与 localStorage 区别
  ①localStorage 的数据永久保存
  ②sessionStorage 关闭浏览器就没有了

5:应用级别的缓存(缓存文件,css,js 图片.)
  咱们新建一个html 文件 而后我要为这个html 文件制定缓存的
  首先第一步,我要新建一个 demo.appcache
  而后在html 里面引用这个 demo.appcache 文件
  manifest="demo.appcache"
  而后咱们要指定缓存的数据 ,在 demo.appcache 缓存文件里面指定

第一行:
CACHE MANIFEST
我须要指定那些文件须要缓存
CACHE:
须要缓存的文件的路径
NETWORK:
那些文件须要网络才能访问.浏览器

相关文章
相关标签/搜索