功能預加載圖像？

Question

我已使用以下JavaScript成功在我的網站上預加載了圖片：

loveHover = new Image();
loveHover.src = "http://mypage.com/images/love-hover.png";

有沒有簡單的好方法可以將此內容包裝到函數中？ 就像是：

function preloadImage(image) {
    var image = new Image();
    var path = "http://mypage.com/images/";
    image.src = path + image;
}

Answer 1

["love-hover.jpg", "like-hover.jpg", "hate-hover.jpg"].forEach(function(img)
{
    new Image().src = "http://mypage.com/" + img;
});

若要使其能夠在9之前的IE版本中工作，請參閱Array.forEach兼容性部分以獲取說明。

Answer 2

函數的唯一部分就是src（鏈接到圖像）。 因此，請提出論點。

function preloadImage(src) {
    var image = new Image();
    image.src = src;
}

然后，如果您有多個網址，請將它們存儲在數組中：

var imageSrcs = [
    "http://mypage.com/images/love-hover.png#",
    "http://mypage.com/images/love-hover2.png",
    "http://mypage.com/images/love-hover3.png"
];

並使用循環預加載圖像：

for (var i = 0; i < imageSrcs.lengthl i++)
    preloadImage(imageSrcs[i]);

Answer 3

您是否嘗試過完全不使用JavaScript？

http://perishablepress.com/press/2008/06/14/a-way-to-preload-images-without-javascript-that-is-so-much-better/