如何不让html5 app cache的manifest缓存当前页面

网上的解决方案是用iframe加载manifest，但是我自己尝试了一个好像不行啊，资源文件并没有从app cache里面加载。(clock.js和clock.css仍然访问server端)

我的代码如下，请大家帮忙看看是哪儿没写对吗？或者谁能给个例子，谢谢！

主页面index.html

<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Clock</title>
    <link rel="stylesheet" href="css/clock.css">
    <script src="js/clock.js"></script>
</head>

<body>
    <iframe src="cache.html" style="display:none;"></iframe>
    <h1>Clock</h1>
    <p>当前时间是：
        <output id="clock"></output>
    </p>
</body>


</html>

加载manifest文件的iframe页面cache.html

<!DOCTYPE html>
<html manifest="app.appcache">

<head>
    <meta charset=utf-8 />
    <title>cache</title>
</head>

<body>
</body>

</html>

app.appcache

CACHE MANIFEST
# VERSION 1.0

CACHE:
css/clock.css
js/clock.js

这应该跟每个浏览器的版本实现机制有关系。

chrome 版本 31.0.1650.63

测试结果：如果把js放在index.html的body底部，那么就可以实现clock.js的app cache，但是clock.css是不行的。
ff 版本 28.0

测试结果：只能实现cache.html本身的缓存。

所以目前看来当初的这种HACK机制，只是在某个浏览器的某个版本支持。类似的问题的答案在stackoverflow上也有。不过，在用APP CACHE开始之前，还是要三思为何要用。APP CACHE 的提出是为了打造离线应用，也就是说离线后，应用可以通过依赖本地缓存文件达到正常使用。
如果说非要不缓存当前页面，目前看起来只能通过AJAX来动态加载页面的动态内容来解决了。

【热门文章】