什么是 HTML5 中的清单文件？

清单文件是一个文本文件，它告诉浏览器缓存某些文件或网页，以便即使在离线模式下也可以使用它们。 HTML5 通过在 标签中指定 manifest 属性来缓存网页。每当用户访问该页面时，将缓存包含清单属性或在清单文件中指定的所有网页。清单文件以.appcache扩展名保存。它总是以 CACHE MANIFEST 关键字开头，包含三个部分：

• 缓存
• 网络
• 倒退

CACHE：这部分列出了所有资源，包括网页、CSS 样式表、JavaScript 文件和将在首次下载后立即缓存的图像。这些资源在首次下载后甚至可以在离线模式下使用，并且不需要连接到服务器。

示例：创建一个名为 cache.html 的文件，并将其添加到demo.appcache文件的 CACHE 部分，以便缓存它并在离线模式下使用。该文件将以离线模式加载。

HTML

    

    
Welcome to GeeksforGeeks!!

    

NETWORK：这部分列出了所有永远不会被缓存的资源。这些资源不能在离线模式下使用，并且始终需要连接到服务器。

示例：创建一个名为 network.html 的文件并将其添加到demo.appcache文件的 NETWORK 部分，以确保它仅在在线模式下可用。此文件不会在离线模式下加载。

HTML

     

    
Welcome to GeeksforGeeks!!
    
Available only in online mode!

  

FALLBACK：本节列出了在页面不可访问的情况下将使用的后备资源。它指定了在服务器连接失败的情况下将被替换为旁边指定的回退资源的主要资源。

示例：创建一个名为 offline.html 的文件，并将其与demo.appcache文件中的 fallback.html 一起添加到 FALLBACK 部分。在离线模式下，offline.html 将被替换为 fallback.html。以下是offline.html 的代码：

HTML

  

    
Welcome to GeeksforGeeks!!
    
You are working in online mode.

  

以下是 fallback.html 的代码：

HTML

  

    
Welcome to GeeksforGeeks!!
    
You are working in offline mode.

  

以下将是内容 demo.appcache文件：

CACHE MANIFEST

CACHE:
cache.html

NETWORK:
network.html

FALLBACK:
offline.html fallback.html

现在，创建 index.html 以链接所有上述文件。

HTML

  

    

    
GeeksforGeeks
    Cached File
    Network File
    Fallback File

输出：

脱机模式下的清单文件缓存输出