html5离线缓存更新

发布时间:2014-11-07 13:00:19 阅读:964次
<!--http://msdn.microsoft.com/zh-cn/library/ie/hh673545(v=vs.85).aspx-->

<!--http://blog.csdn.net/fdipzone/article/details/12718945-->

<!DOCTYPE HTML>
<html manifest="show.manifest">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>学习html5学习网</title>
<script type="text/javascript" src="http://www.phpjx.com/js/jquery.min.js"></script>
<script>
if (navigator.onLine) {
  //alert('online')
} else {
  alert('offline');
}
window.addEventListener("offline", function(e) {alert("offline");})
window.addEventListener("online", function(e) {alert("online");})
var sCacheStatus = "Not supported";
if (window.applicationCache)
{
   var oAppCache = window.applicationCache;
   switch ( oAppCache.status )
   {
      case oAppCache.UNCACHED :
         sCacheStatus = "Not cached";
         break;
      case oAppCache.IDLE :
         sCacheStatus = "Idle";
         break;
      case oAppCache.CHECKING :
         sCacheStatus = "Checking";
         break;
      case oAppCache.DOWNLOADING :
         sCacheStatus = "Downloading";
         break;
      case oAppCache.UPDATEREADY :
         sCacheStatus = "Update ready";
         break;
      case oAppCache.OBSOLETE :
         sCacheStatus = "Obsolete";
         break;
      default :
        sCacheStatus = "Unexpected Status ( " +
     oAppCache.status.toString() + ")";
        break;
   }
}
console.log(sCacheStatus);
//alert(sCacheStatus);
if(sCacheStatus=="Downloading" || sCacheStatus=="Update ready"){
    //alert('update');
    window.location.reload();
}

if (window.applicationCache) {
  var appCache = window.applicationCache;
   appCache.addEventListener('error', appCacheError, false);
   appCache.addEventListener('checking', checkingEvent, false);
   appCache.addEventListener('noupdate', noUpdateEvent, false);
   appCache.addEventListener('downloading', downloadingEvent, false);
   appCache.addEventListener('progress', progressEvent, false);
   appCache.addEventListener('updateready', updateReadyEvent, false);
   appCache.addEventListener('cached', cachedEvent, false);
}
</script>
</head>
<body>
<div class="content">  
<p>
<img src="http://www.glphp.com/uploadfile/2012/0627/thumb_110_90_20120627101259723.png">
<br>
Web2.0 技术鼓励个人的参与,每个人都是 Web 内容的撰写者。如果 Web 应用能够提供离线的功能,让用户在没有网络的地方(例如飞机上)和时候(网络坏了),也能进行内容撰写,等到有网络的时候,再同步到 Web 上,就大大方便了用户的使用。HTML5 作为新一代的 HTML 标准,包含了对离线功能的支持。本文介绍了 HTML5 离线功能中的离线资源缓存、在线状态检测、本地数据存储等内容,并举例说明了如何使用 HTML5 的新特性开发离线应用<br>
</p>
</div>
</body>
</html>

show.manifest

CACHE MANIFEST
#2.2.1.0.1.0.a.b.c.d.e.f.g.h.
NETWORK:

http://www.phpjx.com/js/
http://www.glphp.com/uploadfile/
*
#3.2.3.2

如有问题,可以QQ搜索群1028468525加入群聊,欢迎一起研究技术

支付宝 微信

有疑问联系站长,请联系QQ:QQ咨询

转载请注明:html5离线缓存更新 出自老鄢博客 | 欢迎分享