预缓存/预加载目录答案

【问题标题】：Precache / Preload directory预缓存/预加载目录
【发布时间】：2012-07-06 22:47:16
【问题描述】：

一直在寻找预加载图像目录的方法，发现这是此处提供的最佳脚本：http://perishablepress.com/3-ways-preload-images-css-javascript-ajax/ 我最喜欢这个，因为它在预加载之前等待当前文档加载，但我想让这个人加载一个图像目录而不是指定每个文件，而且我对 javascript 很陌生，任何帮助表示赞赏。

function preloader() {
if (document.images) {
    var img1 = new Image();
    var img2 = new Image();
    var img3 = new Image();

    img1.src = "http://domain.tld/path/to/image-001.gif";
    img2.src = "http://domain.tld/path/to/image-002.gif";
    img3.src = "http://domain.tld/path/to/image-003.gif";
    }
}
function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
    window.onload = func;
} else {
    window.onload = function() {
        if (oldonload) {
            oldonload();
        }
        func();
        }
    }
}
addLoadEvent(preloader);

【问题讨论】：

标签： image caching load onload preload

【解决方案1】：

没有通用的方法来实现这一点。您需要某种方式从服务器检索目录的内容，并且不能保证您的 Web 服务器会提供列表。通常，大多数 Web 服务器不允许客户端列出服务器端目录的内容。

如果您控制 Web 服务器，则可以对其进行配置，以便显示目录列表，例如，当您要求“http://domain.tld/path/to/”时。但即便如此，返回响应的格式也可能会有所不同，具体取决于 Web 服务器。

但是，如果您能够从服务器获取给定目录中的图像列表，您仍然需要使用 AJAX 或隐藏的 IFRAME 等技术来加载这些图像名称。然后，您可以使用 JavaScript 遍历文件名，构造 URL，并为每个文件创建一个 Image 对象。

【讨论】：