预加载图像的功能？

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

为了得到这个工作的IE版本早于9，请参阅Array.forEach Compatibility section以获取说明。

Answer 2

您是否尝试过不使用JavaScript？

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

Answer 3

嘛功能的独特之处将是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]);