HTML5应用程序缓存

使用HTML5,通过创建一个cache manifest文件,可以轻松地创建web应用的离线版本。

什么是HTML5应用程序缓存?

自从HTML5引入了应用程序缓存,这意味着web可以进行缓存,可以在没有连接网络的情况下继续访问web.

应用程序缓存为应用带来了三个优势:

1、离线浏览-用户可以应用离线时使用它

2、速度-已缓存资源加载更快

3、减轻服务器的负载-浏览器只从服务器下载更新过或更改过的文件

实例:

<!DOCTYPE html>
<html manifest="demoIndex.manifest">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<style type="text/css"></style>
<script type="text/javascript" src="Css/jquery-2.1.4.js"></script>
</head>
<body>
<script src="demoTime.js"></script>
<p id="pid"><button οnclick="getTime()">获取日期和时间</button></p>
<figure>
<figcaption>HTML5LOGO</figcaption>
<img src="Images/HTML5LOGO.jpg" alt="html5logo" />
</figure>
<p>尝试打开<a href="tryhtml5HtmlManifest.html">这个页面</a>,这个页面在离线的状态下仍然可以打开进行访问。</p>
</body>
</html>

 

Cache Manifest基础

如果需要启用应用程序缓存,那么就要在<html>标签中包含manifest属性

如:<!DOCTYPE html>
<html manifest="demoIndex.appcache">

......

</html>

每个指定了manifest属性的页面在用户进行访问时都会被缓存,如果没有指定,则页面不会被缓存,除非在manifest文件中直接指定缓存该页面。

manifest文件的建议扩展名为.manifest

请注意,manifest 文件需要配置正确的 MIME-type,即 "text/cache-manifest"。必须在 web 服务器上进行配置。

转载于:https://www.cnblogs.com/melao2006/p/4978787.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值