`
流浪鱼
  • 浏览: 1682097 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

HTML5的离线存储applicationCache

 
阅读更多

html5离线应用接口规范

网址:https://html.spec.whatwg.org/#applicationcache

interface ApplicationCache : EventTarget {

  // update status
  const unsigned short UNCACHED = 0;
  const unsigned short IDLE = 1;
  const unsigned short CHECKING = 2;
  const unsigned short DOWNLOADING = 3;
  const unsigned short UPDATEREADY = 4;
  const unsigned short OBSOLETE = 5;
  readonly attribute unsigned short status;

  // updates
  void update();
  void abort();
  void swapCache();

  // events
  attribute EventHandler onchecking;
  attribute EventHandler onerror;
  attribute EventHandler onnoupdate;
  attribute EventHandler ondownloading;
  attribute EventHandler onprogress;
  attribute EventHandler onupdateready;
  attribute EventHandler oncached;
  attribute EventHandler onobsolete;
};

 

1.离线资源的缓存

离线应用将使用manifest类型的文件作为需要配置缓存文件的配置文件

2.ApplicationCache

ApplicationCache对象记录着web应用程序的缓存状态,开发者可以通过该缓存状态手动更新资源文件的缓存。

3.在线状态监测

html5标准提供online方法用于检测当前网络是否在线。

window.navigator.online

监听事件

applicationCache.addEventListener('updateready',function(){
    alert("离线文件下载完毕");
});

 包含的事件名为:

checking

noupdate

downloading

progress

cached

updateready

obsolete

error



 

 

 

 

 

 

 

 

 

 

 

  • 大小: 462.6 KB
分享到:
评论

相关推荐

    HTML5离线存储

    我通过Application Cache+localStorage+web sql构建了一个离线应用,同时我也把逻辑按照Application cache+localStorage+indexedDB写了一次,有兴趣的同学可以下载,同时代码...可以让大家很快理解HTML5离线存储技术

    html5离线存储课程代码

    Application Cache是一种较早的离线存储方式,它通过manifest文件来指定需要离线存储的资源,当用户首次访问网站时,浏览器会下载manifest文件并根据其内容缓存相应的网页和资源。这样,在离线状态下,浏览器可以...

    html5离线存储实例

    首先,我们来看看Application Cache,也被称为离线存储。这是一种基于文件的缓存机制,允许开发者指定一组资源(如HTML、CSS、JavaScript、图片等)进行离线存储。通过在HTML文件的`<head>`部分添加`<manifest>`标签...

    HTML5_离线存储技术

    这项技术的核心在于利用HTML5的`Application Cache`(应用缓存)或者称为`Cache Manifest`(缓存清单),通过创建一个清单文件来指定需要离线存储的资源。 **一、离线存储的必要性** 随着移动设备的普及,用户可能...

    HTML5离线应用

    这一功能通过HTML5的离线存储标准实现,包括Application Cache(应用程序缓存)和Service Worker(服务工作者)。在本案例中,提供的压缩包文件包含了一系列用于展示HTML5离线应用的元素和实践。 1. **notes.html**...

    HTML5离线应用实例介绍

    ApplicationCache(简称AppCache)是HTML5提供的一种离线存储技术,它允许浏览器缓存应用的资源文件,以便在离线状态下使用。 ##### 定义manifest: - **定义方式**:通过在HTML文档头部添加`<html manifest=...

    html5 离线应用

    这一特性通过HTML5的离线存储标准实现,主要包括Application Cache(应用缓存)和Service Worker。这篇博客可能深入探讨了这两个核心概念,以及如何在实际项目中应用它们。 Application Cache,又称为Manifest文件...

    HTML5离线缓存技术 附源码.我们知道h5多了很多新技术,其中之一便是可以离线缓存数据,这样当网络断了时,仍然可以浏览网页

    这项技术主要依赖于HTML5的Application Cache(应用缓存)API,也被称为离线存储。下面将详细介绍这个技术及其工作原理,并提供相关的源码示例。 1. **离线缓存的基本概念** HTML5的离线缓存允许开发者创建一个...

    HTML5离线应用程序.pdf

    HTML5离线应用程序的核心在于利用`离线存储`这一特性,使得Web应用即使在无网络连接的情况下也能继续运行。...然而,理解并熟练运用`Application Cache`对于理解现代Web的离线存储机制仍然是十分重要的。

    html5教程 w3school离线版

    `Application Cache`是HTML5离线存储的重要特性,允许网站的部分内容被缓存到本地,即使在网络不畅的情况下也能访问。 5. **Canvas绘图** `<canvas>`元素提供了JavaScript画布,开发者可以通过JavaScript来绘制...

    html5前端浏览器离线缓存

    HTML5前端浏览器离线缓存,也称为离线存储或应用程序缓存,是HTML5引入的一项重要特性,旨在提升Web应用的性能和用户体验。当用户在网络连接可用时访问一个支持离线缓存的网站,浏览器会自动下载并存储指定的资源,...

    HTML5实现图书馆资源离线阅读的探讨.pdf

    HTML5引入了离线存储机制,称为离线存储(Offline Storage)或应用程序缓存(Application Cache),允许开发者将部分网页内容和资源(如图片、JavaScript、CSS文件等)存储在用户的本地设备上。当用户在网络连接不...

    HTML5在线版+离线版

    离线存储是HTML5的一项重要特性,称为离线存储应用程序缓存(Application Cache)。它允许开发者将部分网页内容缓存到本地,即便在网络不畅或无网络的情况下,用户仍能访问这些页面,提高了用户体验。 HTML.CHM和...

    读取离线网页

    这主要依赖于浏览器的离线存储功能,如HTML5的离线存储规范(Application Cache)或者更现代的Service Worker机制。这些技术使得用户能够在有网络的时候提前下载网页内容,然后在需要的时候本地读取,不受网络状况的...

    HTML5离线缓存Manifest是什么

    HTML5离线缓存,又称为离线存储或Application Cache,是HTML5引入的一项功能,旨在提高Web应用程序的性能和可用性。它允许开发者创建能够离线工作的Web应用,即使在网络不可用的情况下,用户仍然可以访问和使用这些...

    css+css3+html+html4+js离线手册

    3. **离线存储**:`applicationCache`允许网页在离线状态下访问部分数据。 4. **表单控件**:新增了`<input type="date">`、`<input type="range">`等,提高了用户输入体验。 5. **画布和SVG**:`<canvas>`用于动态...

    html5应用缓存_动力节点Java学院整理

    HTML5中的应用缓存(Application Cache)是一种离线存储技术,允许Web应用程序在用户没有网络连接的情况下仍能正常运行。这种技术通过创建一个名为`cache manifest`的文件,指定需要缓存的资源,从而实现离线浏览。...

    前端开发各种离线手册

    此外,还有对表单元素、多媒体支持以及离线存储(Application Cache)等内容的详细解释。 2. **CSS**:CSS(Cascading Style Sheets)用于控制网页的样式和布局。离线手册可能包括了选择器、盒模型、布局模式(如...

    使用 HTML 5 支持移动 Web 应用程序离线工作

    其中,离线存储( Offline Storage)是HTML5的重要特性之一,它允许 Web 应用程序在没有网络连接的情况下也能正常运行。本文将深入探讨如何使用 HTML5 的离线存储功能来构建支持移动 Web 应用程序离线工作的应用。 ...

Global site tag (gtag.js) - Google Analytics