javascript - 如何使用外部预加载器预加载网页？

Question

我有一个简单的 HTML 页面，其中有一个大图像作为全屏背景；我调用了这个页面index2.html。

我想创建另一个页面index.html，该页面将完全预加载index2.html，然后将用户引导至该页面。但是，我在 Internet 上找到的所有预加载器解决方案都基于单个 HTML 页面。

我怎样才能做到这一点？任何帮助，将不胜感激。

Answer 1

您可以通过将图像加载index.html为 1 像素图像来使浏览器缓存图像

<img src="/index2-background-image.jpg" alt="" width="1" height="1" />

index2.html或者，您可以像这样使用 jQuery加载内容：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery().ready(function () {
    $.get('index2.html', function(data) {
        jQuery("#index2content").html(data);
    });
});
</script>

<div id="index2content"></div>