在项目中引入 js 文件一般是如下这种模式：
懒加载：
当文件被需要时才被加载即 执行fn()时，多次执行fn()只会加载一次js文件
预加载：
文件会在浏览器空闲的时候提前加载，有兼容性问题需慎用
预加载图片是提高用户体验的一个很好方法。图片预先加载到浏览器中，这对图片画廊及图片占据很大比例的网站来说十分有利，它保证了图片快速、无缝地发布，也可帮助用户在浏览网站内容时获得更好的用户体验。示例代码：
function
loadImage(url,
callback)
{
var
img
=
new
Image()
//创建一个Image对象，实现图片的预下载
img.src
=
url
if
(img.complete)
{
//
如果图片已经存在于浏览器缓存，直接调用回调函数
callback.call(img)
return
//
直接返回，不用再处理onload事件
}
img.onload
=
function
()
{
//图片下载完毕时异步调用callback函数。
callback.call(img)//将回调函数的this替换为Image对象
}
}
jquery预加载的两种方式说明如下：1、通过写函数进行预加载
function preload(arrayOfImages) {
$(arrayOfImages).each(function(){
$('<img/>')[0].src = this//循环加载传进来的图片数组
})
}
调用方法：
preload([
'img/imageName.jpg', //图片1
'img/anotherOne.jpg',//图片2
'img/blahblahblah.jpg'//图片3
])
2、通过插件的方式预加载
//自定义函数preload，实现原理跟方法一差不多
$.fn.preload = function() {
this.each(function(){
$('<img/>')[0].src = this
})
}
调用方法：
$(['img1.jpg','img2.jpg','img3.jpg']).preload()
