在有大量图片的页面中，为了避免页面加载完图片还未加载完成，我们通常会使用js的图片预加载。
这是一个预加载的demo：
首先把图片放入到一个类名为imgSrcArr的变量当中：
var imgSrcArr = [
‘./imgs/01.png’,
‘./imgs/02.png’,
‘./imgs/03.png’,
‘./imgs/04.png’,
‘./imgs/05.png’
]
再用一个变量来储存要遍历的图片：
var imgWrap = [];
用一个函数来执行这个方法：
function preloadImg(arr) {
for(var i = 0; i < arr.length; i ++) {
imgWrap[i] = new Image();
imgWrap[i].src = arr[i];
}
}
页面加载时执行此函数：
window.onload = function() {
preloadImg(imgSrcArr);
}
在页面执行此函数：
$(function(){
var imgSrcArr = [
‘./imgs/01.png’,
‘./imgs/02.png’,
‘./imgs/03.png’,
‘./imgs/04.png’,
‘./imgs/05.png’
];
var imgWrap = [];
function preloadImg(arr) {
for(var i = 0; i < arr.length; i ++) {
imgWrap[i] = new Image();
imgWrap[i].src = arr[i];
}
}
window.onload = function() {
preloadImg(imgSrcArr);
}
})