在项目中引入 js 文件一般是如下这种模式：
懒加载：
当文件被需要时才被加载即 执行fn()时，多次执行fn()只会加载一次js文件
预加载：
文件会在浏览器空闲的时候提前加载，有兼容性问题需慎用
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()
声音预加载，可以通过绕一下的方式去实现它，就是首先在头部构建你所需要加载的声音，然后添加对应的bgsound对象，让其同步加载，当声音全部加在完后，html回去执行window.onload动作，这个时候，声音已经在本地IE缓存中，然后在onload中删除预加载的bgsound对象，这样就是先了声音的预加载。你在测试的时候可以先清空IE缓存，然后执行代码，再查看缓存。
代码如下：
<HTML>
<HEAD>
<TITLE>New Document </TITLE>
<bgsound volume='-5000' id='bgsound1' loop='1' src="http://localhost:8088/bpelDemo/aaa.mp3">
<bgsound volume='-5000' id='bgsound2' loop='1' src="http://localhost:8088/bpelDemo/bbb.mp3">
<bgsound volume='-5000' id='bgsound3' loop='1' src="http://localhost:8088/bpelDemo/ccc.mp3">
<bgsound volume='-5000' id='bgsound4' loop='1' src="http://localhost:8088/bpelDemo/ddd.mp3">
</HEAD>
<BODY>
<script>
function window.onload(){
var bgSoundObj = document.getElementById("bgsound1")
bgSoundObj.src=""
bgSoundObj.volume=1
//删除多余的bgsound对象
var bgSoundObjs = document.getElementsByTagName("bgsound")
for(var i=1i<bgSoundObjs.lengthi++){
bgSoundObjs[i].removeNode()
}
alert("目前所有音乐加载完成，可以去IE缓存查看加载MP3文件")
}
</script>
声音已经加载，播放无需重新加载<p>
<input type='button' onclick='document.getElementById("bgsound1").src="http://localhost:8088/bpelDemo/aaa.mp3"' value="music1">
<input type='button' onclick='document.getElementById("bgsound1").src="http://localhost:8088/bpelDemo/bbb.mp3"' value="music2">
<input type='button' onclick='document.getElementById("bgsound1").src="http://localhost:8088/bpelDemo/ccc.mp3"' value="music3">
<input type='button' onclick='document.getElementById("bgsound1").src="http://localhost:8088/bpelDemo/ddd.mp3"' value="music4">
</script>
</BODY>
</HTML>
