从HTML5开始，支持将页面资源（包括.html、.css、.js、.png）等缓存起来，从而实现离线应用
步骤如下：
1、准备appcache清单文件
清单文件可以使用任何扩展名，只需要在步骤2中，在web server里注册即可
这里起名为demo.appcache，文件内容是
CACHE MANIFEST
CACHE:
5.html
5.css
jquery-1.8.0.js
5.js
2、注册appcache清单文件的MIME
对于tomcat，在%TOMCAT_HOME%/conf/web.xml里配置
<mime-mapping>
<extension>appcache</extension>
<mime-type>text/cache-manifest</mime-type>
</mime-mapping>
3、在要缓存的html里关联清单文件
<!DOCTYPE html>
<html manifest="demo.appcache">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="5.css" />
<script type="text/javascript" src="jquery-1.8.0.js"></script>
<script type="text/javascript" src="5.js"></script>
<title>5</title>
</head>
<body>
<div id="myDiv">hello world</div>
<button id="btn">run</button>
</body>
</html>
4、编程（javascript）控制applicationCache对象
$(document).ready(function() {
$("#btn").click(showCache);
function showCache(){
alert(applicationCache.status);
applicationCache.update();
}
});
5、效果
通过上面的配置，5.html页面相关的资源就会被支持ApplicationCache的浏览器缓存起来，支持离线操作
关于applicationCache对象，其实还有一些别的API，支持状态和事件绑定等，详细的文档可参见：
1
http://www.thecssninja.com/javascript/how-to-create-offline-webapps-on-the-iphone
2
http://www.w3schools.com/html/html5_app_cache.asp
分享到：
相关推荐
从指定的文件列表生成HTML5 AppCache清单的艰巨任务。 入门 这个插件需要~0.4.1 如果您以前从未使用过 ，请务必查看《指南》，因为它说明了如何创建以及安装和使用Grunt插件。 熟悉该过程后，可以使用以下命令安装...
标题中的"PyPI 官网下载 | django-html5-appcache-0.2.0.tar.gz"指的是Python的包管理器PyPI（Python Package Index）上发布的名为`django-html5-appcache`的软件包的0.2.0版本，该版本被压缩为一个tar.gz文件。...
应用程序缓存源基于目录内容为静态网站生成 HTML5 AppCache 清单的节点模块。安装 $ npm install appcachegen --save安装在您的项目中或 $ sudo npm install -g appcachegen全局安装用法appcachegen 可以在命令行或 ...
1. **HTML5 AppCache（Application Cache）**：`demo_html.appcache`可能涉及到HTML5的离线存储功能。AppCache允许开发者创建一个缓存清单文件，指定哪些资源需要在用户首次访问时下载并缓存，这样即使在网络断开的...
清除HTML 5 appcache和缓存。 构建离线应用程序？ 需要一个简单高效的工具来清理appcache和缓存吗？ 此扩展名适合您！ 它允许您清除HTML 5应用程序缓存和缓存（JS，...）。 当前页面的清单将根据范围删除。 它非常...
3. **HTML5 AppCache或Service Worker**：为了离线使用Web桌面，开发者可能利用HTML5的AppCache或者Service Worker技术，将必要的资源缓存到本地，使得用户在无网络连接时仍能使用部分功能。 4. **Electron或PWA**...
5. **事件通知**: AppCache的更新过程伴随着一系列事件，如`checking`（检查更新）、`downloading`（下载资源）、`progress`（下载进度）、`cached`（资源已缓存）、`updateready`（更新就绪）等，开发者可以通过...
1. **HTML5新特性**：包括新的语义化标签（如、、等）、离线存储（AppCache）、拖放功能、媒体元素（和）等。 2. **Canvas与SVG**：这两个图形绘制API让开发者可以动态生成图像，Canvas适合像素级操作，SVG则用于...
HTML5是现代网页开发的核心技术，它在2014年被正式确立为W3C标准，极大地丰富了网页内容的展示方式和交互性。这篇关于"HTML5毕业论文实例"的压缩包包含了多份原创设计的毕业论文，这些论文主要探讨了HTML5在前端网页...
HTML5还引入了离线存储机制，如AppCache和IndexedDB，使得网页应用可以在离线状态下继续运行。这对于构建离线优先的应用，或者需要大量数据存储的项目非常有用。 Web Workers和Web Storage也是HTML5的重要组成部分...
《HTML5 in Action》是一本深入探讨HTML5技术的专业书籍，其英文版为读者提供了全面了解和掌握HTML5的详细指南。HTML5是超文本标记语言（HTML）的最新版本，自2008年发布以来，它已经成为现代网页开发的核心技术。这...
HTML5是现代网页开发的核心标准，它在原有HTML4的基础上引入了诸多新特性，极大地提升了网页的交互性和表现力。本实例将详细讲解如何利用HTML5来构建一个完整的网站，包括布局、登录功能以及内容展示。 一、HTML5的...
- HTML5的离线存储（AppCache）和Service Worker可以实现离线应用，提高网页性能。 - Geolocation API用于获取用户的地理位置信息，增强位置服务功能。 - Web Workers和Web Storage提升后台处理能力和本地数据...
HTML5还引入了离线存储（AppCache）、Web Storage（包括localStorage和sessionStorage）以及Web Workers等特性，提高了网页应用的性能和用户体验。 CSS3（层叠样式表）是CSS的第三个主要版本，它带来了许多新的选择...
清除html 5 appcache和缓存。 构建脱机应用程序？ 需要一个简单而有效的工具来清理AppCache和缓存？ 这个延期适合您！ 它允许您清除HTML 5 AppCache和Cache（JS，...）。 根据范围删除来自当前页面的清单。 它非常...
这个项目的核心是利用HTML5的新特性，如Canvas、SVG、WebSocket、离线存储（AppCache）以及媒体元素等，来构建一个具有窗口管理、任务栏、通知中心等功能的Web界面。HTML5的Canvas元素允许开发者通过JavaScript绘制...
HTML5还强化了离线存储能力，通过离线存储API（如AppCache和IndexedDB），开发者可以创建离线应用，即使在无网络连接的情况下也能正常运行。Web Workers和Web Storage则进一步提高了网页的多任务处理能力和数据存储...
2. **离线存储与本地存储**：HTML5的离线存储（AppCache）允许网页在离线状态下访问部分数据，Web Storage（包括localStorage和sessionStorage）则提供了客户端数据持久化的解决方案，改善了对用户数据的处理。...
8. **HTML5的其他特性**：如离线存储（AppCache）、WebSocket实时通信、Web Workers和Web Storage等，这些在个人博客中可能被用来提升用户体验。 9. **响应式设计**：考虑到个人博客需要适应不同设备的屏幕尺寸，...