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应用的支持不是很好，备用区域和操作离线缓存暂时不可用
