启动html5的应用缓存

<!DOCTYPE HTML>

<html manifest="filename.appcache">

</html>

filename.appcache的例子

CACHE MANIFEST

# 版本标识 v1

# 必选 缓存文件

CACHE:

/webapp/html/resource/test.css

/webapp/html/test.html

# 可选 需要联网

NETWORK:

/webapp/html/HCApproval_Main.html

# * 表示全部都需要

# 可选 失败的重定向

# FALLBACK:

# / webapp/html/help.html

更新缓存

浏览器清除缓存

filename.appcache 文件的任意修改，也会触发缓存更新

JS更新缓存

window.addEventListener('load', function(){

        // window.applicationCache.update(); // 手动更新缓存 或者 监听到加载缓存完成事件后 刷新页面
　　window.applicationCache.addEventListener("updateready", function(e){

　　console.log(window.applicationCache.status);
　　setTimeout(function(){
　　　　window.location.reload();
　　}, 3000);
　　});
});
window.applicationCache 对象属性和事件方法
  1. oncached:null
  2. onchecking:null
  3. ondownloading:null
  4. onerror:null
  5. onnoupdate:null
  6. onobsolete:null
  7. onprogress:null
  8. onupdateready:null
  9. status:1
window.applicationCache.status 的几个值
  • UNCACHED (0)：未启用离线应用
  • IDLE (1)：已开启离线应用，但本地缓存的资源是最新的，并且未标记为废弃资源
  • CHECKING (2)：当前更新缓存的状态为“检查中”
  • DOWNLOADING (3)：当前更新缓存的状态为“下载资源中”
  • UPDATEREADY (4)：当前更新缓存的状态为“更新完毕”
  • OBSOLETE (5)：已开启离线应用，但缓存资源都已标记为废弃

html5 的缓存应用 manifest="filename.appcache"的更多相关文章

  1. HTML5离线缓存Manifest

    web app不比PC,有性能和流量方面的考虑,离线应用越来越重要,虽然浏览器有缓存机制,但是时常不靠谱,更何况普通情况下html文件是没法缓存的,断网之后一切over. 什么是manifest? 简 ...

  2. HTML5 离线缓存Appcache

    创建一个和html同名的manifest文件,比如页面为index.html,那么可以建一个index.manifest的文件,然后给index.html的html标签添加如下属性即可: <ht ...

  3. HTML5 缓存: cache manifest

    ---恢复内容开始--- 1:MIME TYPE:text/cache-manifest 服务器配置MIME类型2:需要由你创建的:NAME.manifest 创建manifest文件3:给 < ...

  4. HTML5离线缓存问题

    HTML5离线缓存问题 1.应用程序缓存 什么是应用程序缓存(Application Cache)? HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. ...

  5. HTML5离线缓存

    参考文档:http://www.w3cschool.cc/html/html5-app-cache.html HTML5 应用程序缓存 又称离线缓存 ,即使断线了,刷新后也还是缓存了原来的页面,不会4 ...

  6. H5离线缓存机制-manifest

    简介:Manifest 其实就是web应用的一种缓存机制,主要用于现在webapp应用中,它是浏览器自己的一种机制,随着移动互联网时代的到来,网络可靠性降低,如果我们已经将需要的文件缓存下下来,一旦网 ...

  7. HTML5 离线缓存详解（转）

    离线缓存是html5新特性之一,简单理解就是第一次加载后将数据缓存,在没有清除缓存前提下,下一次没有网络也可以加载,用在静态数据的网页或游戏比较好用.当然,Html5新的特性都不是所有浏览器都能支持的 ...

  8. HTML5 Web缓存&运用程序缓存&cookie,session

    在介绍HTML5 web缓存前,来认识一下cookie和session: session: 由于HTTP是无状态的,你是谁?你干了什么?抱歉服务器都是不知道的. 因此session(会话)出现了,它会 ...

  9. html5离线缓存使用

    html5 离线缓存使用以及注意事项 1.index.html中加入离线缓存的声明文件 如:<!DOCTYPE html><html manifest="test.appc ...

随机推荐

  1. 【PHP入门到精通】：Ch03：PHP语言基础

    1, PHP风格 这里为了显示代码把"<"和">"和key值以空格分开了,实际书写时切记不要将其分开: (1) < ?php ? >: ...

  2. HDU 5137 How Many Maos Does the Guanxi Worth

    How Many Maos Does the Guanxi Worth Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 512000/5120 ...

  3. C#-gdi绘图,双缓冲绘图,Paint事件的触发

    一. 画面闪烁问题与双缓冲技术 1.1 导致画面闪烁的关键原因分析: 1  绘制窗口由于大小位置状态改变进行重绘操作时 绘图窗口内容或大小每改变一次,都要调用Paint事件进行重绘操作,该操作会使画面 ...

  4. [转] Asp.Net 导出 Excel 数据的9种方案

    湛刚 de BLOG 原文地址 Asp.Net 导出 Excel 数据的9种方案 简介 Excel 的强大之处在于它不仅仅只能打开Excel格式的文档,它还能打开CSV格式.Tab格式.website ...

  5. 基数排序/Go实现

    package main import ( "fmt" ) type Radix struct { length int //序列中最大数的位数 radix [][]int //0 ...

  6. Golang做的验证码（2）

    前面一篇文章介绍了2个用Golang做的验证码 http://www.cnblogs.com/ghj1976/p/3392847.html  这里再补充几个: 1.在GAE上使用的Google的验证码 ...

  7. OE7设置菜单为什么这么少？

    默认安装的OE7设置菜单只有很少的功能: 如果需要更多的OE定制,必须开启“技术特性”选项:

  8. <测试用例设计>用户及权限管理功能常规测试方法

    1)  赋予一个人员相应的权限后,在界面上看此人员是否具有此权限,并以此人员身份登陆,验证权限设置是否正确(能否超出所给予的权限): 2)  删除或修改已经登陆系统并正在进行操作的人员的权限,程序能否 ...

  9. 闲谈Future模式-订蛋糕

    一. Future模式简介 Future有道翻译:n. 未来:前途:期货:将来时.我觉得用期货来解释比较合适.举个实际生活中例子来说吧,今天我女朋友过生日,我去蛋糕店准备给女朋友定个大蛋糕,超级大的那 ...

  10. Python的OO思想

    想当年大二的时候,在学校学习Java, 最牛逼的OO思想,用了3页纸就讲完了,还是清华大学出版社的呢. 后来全凭自己啃视频,啃代码才搞懂什么叫做OO. 现在学习Python,就用自己的方式,好好学习一 ...