/*
我们经常会用下载软件下载电视剧，一个电视剧可以能有N集。
1.先把所所有的集数全部下载完成，然后一个个开开心心的看。你真的开心吗？
2.我们先下一集，然后看完，看完以后再去下下一集，然后再看。
3.我们先下第一集，下载完成以后，再看第一集的时候去下载后面的内容，这样，我们可以在看前面的内容的时候，把后面的下完了，节约了很多的时间
在页面刚打开的时候，我们去加载第一张图片，然后页面加载完成以后，在用户看的时间内，去加载后面的内容，那么我们必须有个工具（迅雷） -> Image对象
*/
/*
属性：
src : 当我们给Image对象的src属性赋值一个url的时候，这个Image对象就去会加载url资源，加载完成以后的资源被保存到了浏览器的缓存文件夹里面，下次如果我们要去调用这个url地址的时候，直接是从缓存文件夹读取到的，所以速度很快。
onload : 当资源加载完成的时候触发
onerror : 当资源加载失败的时候触发
*/
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 2 "http://www.w3.org/TR/html4/strict.dtd"> 3 4 <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 7 <title>7.图片预先加载</title> 8 <meta name="author" content="Administrator" /> 9 <!-- Date: 2014-12-12 --> 10 <script> 11 12 13 window.onload=function(){ 14 15 var oImg1=document.getElementsByTagName('img')[0]; 16 var oImage= new Image(); 17 oImage.src='http://gb.cri.cn/mmsource/images/2014/08/11/0/5240451376502243632.jpg'; 18 oImage.onload=function(){ 19 alert('下载完成'); 20 }; 21 22 oImage.onerror=function(){ 23 alert('下载出错') 24 } 25 26 document.onclick=function(){ 27 oImg1.src='http://gb.cri.cn/mmsource/images/2014/08/11/0/5240451376502243632.jpg'; 28 } 29 } 30 </script> 31 </head> 32 <body> 33 <img src=''/ style="400px;"> 34 </body> 35 </html>