预先缓存/预加载目录

时间:2012-07-06 13:09:13

标签: image caching load onload preload

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

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);

1 个答案:

答案 0 :(得分:0)

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

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

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