首页 > 家庭装修 > html5移动web开发指南 源码示例

快速发布【家庭装修】相关需求,专业顾问为您服务 快速发布

用此手机号发布,您还可以点击 更换

发布需求
请输入正确的手机号
请输入正确的验证码

您是不是要找:

  • 专家问诊,提供专业建议
  • 急速响应,体验省心
  • 根据需求灵活定制解决方案

html5移动web开发指南 源码示例

标签:html5移动web开发指南 源码 2017-8-17 作者:t_2180hn1ly1

  下面是一些html5移动web开发指南 源码示例。


  一、html5移动web开发指南 源码:HTML5规范的本地存储


  2个重要的API:Web Storage ,本地数据库Web SQL Database,这里主要讲解Web Storage的用法。


  本地存储Web Storage实际上是Html4中Cookie存储机制的一个改进版本。然而2中机制的作用不相同,Web Storage是把把网站中有用的信息存储到本地计算机和移动设备中。然后根据实际需要从本地读取数据。


  Web Storage提供了2种存储类型API接口。sessionStorage 和localStorage.


  他们的生命周期,sessionStorage是在会话期间内有效。而localStorage就存储在本地,并且存储是永久的,除非用户或者程序对其执行删除操作。


  1.移动设备的支持


  几乎所有浏览器都支持Web Storage存储


  但是,在代码严谨上看,最好还是做检查:先判断浏览器是否支持


  if(window.localStorage){


  //浏览器支持localStorage


  }


  if(window.sessionStorage){


  //浏览器支持sessionStorage


  }


  localStorage


  域内安全,localStorage是基于域的,任何在域内的所欲页面,都可以访问localStorage数据。


  但仍然存在一个问题,就是各个浏览器存储是独立的,就是火狐浏览器使用localStorage存储的数据,Chrome不能访问。


  sessionStorage


  sessionStorage存储的数据生命周期只保存在存储它的当前窗口或由当前窗口新建的新窗口,直到相关联的标签页关闭。使用方法和localStorage基本一致。


  二、html5移动web开发指南 源码:移动web的离线应用


  applicationCache和manifest


  HTML5提供的离线应用,开发者主要注意一下3点特征:


  离线资源缓存


  开发时需要指定哪些资源可以离线缓存。离线应用将使用manifest类型的文件作为需要配置缓存资源文件的配置文件。


  ApplicationCache对象缓存状态


  ApplicationCache记录着Web应用程序的缓存状态,开发者可以根据该缓存状态手动更新资源文件的缓存。


  在线状态检测


  HTML5提供了标准的onLine方法用于检测当前网络是否在线。开发者可以根据方法判断浏览器是否在线。


  manifest文件


  离线应用包含一个manifest文件,此文件记录着哪些文件需要离线缓存。


  


  


  


  


  manifest离线应用演示


  


  


  


  由于manifest文件的MIME类型是text/cahce-manifest,因此web服务需要配置MIME类型,才能识别manifest文件。例如在tomcat服务器下,开发者需要在web.xml文件中配置manifest类型。


  


  


  


  由于manifest文件的MIME类型是text/cahce-manifest,因此web服务需要配置MIME类型,才能识别manifest文件。例如在tomcat服务器下,开发者需要在web.xml文件中配置manifest类型。


  例如,web.xml中需要配置,


  


  manifest


  text/cache-manifest


  


  applicationCache对象和事件


  applicationCache对象记录着本地缓存的各种状态及事件。缓存的状态可以通过window.applicationCache.status获得。其状态包括6种。


  监听资源文件下载中:


  applicationCache.addEventListener("updateready",function(){


  });


  判断浏览器是否在线:


  if(window.navigator.onLine){


  //当前浏览器online


  }else{


  //不在线offline


  }


  以上就是小编带来的关于的html5移动web开发指南 源码全部资讯,大家看完之后有什么感悟吗?如果有什么不满意的地方,小编向你道歉,因为小编也不是这方面的专家,难免有所疏漏,万望海涵!要是想要了解更多相关信息,就去八戒服务购行业资讯看看吧,更多有趣资讯在那等你。


最新文章推荐

家庭装修暂无最新文章查看全部推荐文章>

推荐人才