创建离线web应用

1.定义清单manifest

离线web应用因为有很多资源文件是在线加载的，所以需要提前将这些资源文件缓存起来。
清单manifest可以列出离线工作所需的所有资源：

CACHE MANIFEST
index.html
banner.png
apply.png

FALLBACK:
*.png offline.png

CACHE:
cherries.png

NETWORK：
ready.png

其中，
FALLBACK区域：如果缓存中没有找到相关资源，则使用备用图片。
CACHE区域：需要提前缓存的文件
NETWORK区域：浏览器会尝试从服务器请求相关资源

２.检测浏览器状态

可以根据浏览器的window.navigator.onLine属性判断浏览器离线还是在线。

    if(window.navigator.onLine){
        console.log('online');
    }
    else{
        console.log('offline');
    }

这个属性只有在浏览器确定它是离线状态才是明确的。

3.操作离线缓存

window.applicationCache.update() 更新缓存，确保项目中的资源为最新
*调用此方法时，浏览器会检查清单文件是否有变化，如果有变化就会重新载入缓存

window.applicationCache.swapCache() 交换缓存，将已更新的缓存与当前缓存交换
*调用此方法时页面不会自动刷新，只有下次从缓存中请求资源时才会使用

*目前chorme浏览器对离线web应用的支持不是很好，备用区域和操作离线缓存暂时不可用