📄 day4_4.html
字号:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312-80"><style type="text/css"><!--a:link { color: blue; text-decoration: none}a:visited { color: purple; text-decoration: none}a:hover { color: #CC0033; text-decoration: underline}--></style><title>JavaScript高级教程</title><script language="JavaScript"><!-- hide me// timedAlert// this just calls a function timedAlert(){ var the_timeout = setTimeout("alertAndRedirect();", 3000);}function alertAndRedirect(){ alert('OK! Exhale!'); window.location.replace("day3_2.html");}// show me --></script></head><body topmargin="1" leftmargin="2"><table border="0" width="591" cellspacing="0"> <tr> <td bgcolor="#ffff99" width="451">JavaScript高级教程 - 第四课</td> </tr> <tr> <td bgcolor="#FF6600" width="451"><a href="mailto:thau@wired.com">Thau</a></td> </tr></table><div align="left"> <table border="0" width="630" cellspacing="0"> <tr> <td width="458" valign="top" align="left" rowspan="2"><small><small><br> </small></small><strong>第四页：<font size="3">预装图象 - 怎么做?<br> </font></strong> <table width="451"> <tr> <td width="447"><font size="3">预装入图象其实并不困难。你要做的就是创建一个新的<font face="verdana, arial">image</font><br> 对象，然后把要预装的图象名设定成<font face="verdana, arial">image</font>的<font face="verdana, arial">src</font>属性，如下<br> 所示：<font face="verdana, arial"> <blockquote> <pre>var an_image = new Image();an_image.src = "my_nice_image.gif";</pre> </blockquote> </font> <p><font face="verdana, arial"></font>通过设置<font face="verdana, arial">image</font>的<font face="verdana, arial">src</font>属性就可以自动地把图象下载到你的硬<br> 盘里（当然假设你的<font face="verdana, arial">cache</font>可以用），然后图象变换时就从<br> 硬盘直接读入图象而不用再去下载了。 </p> <p> <font face="verdana, arial"></font>试着把鼠标放在下面的几个链接上，图象变换应该相当快捷<br> 和令人满意的。</p> <p> <font face="verdana, arial"></font><img src="mattmarg.jpg" name="image_one" WIDTH="101" HEIGHT="133"><br> <font face="verdana, arial"><a href="#" onMouseOver="image_one.src='kwmatt.jpg';">1...</a><br> <a href="#" onMouseOver="image_one.src='matbon.jpg';">2...</a><br> <a href="#" onMouseOver="image_one.src='lunchMat.jpg';">3...</a></font></p> </font> <p><font size="3"> <font face="verdana, arial"></font>剩下要做的唯一一件事就是，怎样在页面被下载以后和图象<br> 变换操作之前使预装图象发生。让人愉快的是这很简单。<font face="verdana, arial">HTML</font><br> 中的<font face="verdana, arial">body</font>标记有一个事件处理器叫</font><font face="verdana, arial" size="3"><tt>onLoad</tt></font><font size="3">，当页面被调入后<br> 它将被调用。如果你的<font face="verdana, arial">body</font>标记是这样的：</font></p> <font size="3"> <blockquote> <pre> <font face="verdana, arial"></font><font face="verdana, arial"><body onLoad="doPreload();"></font></pre> </blockquote> <p> <font face="verdana, arial"></font>那么<font face="verdana, arial"><tt>doPreload()</tt></font>函数将在网页下载后被调用。函数的代码是<br> 这样的： </font></td> </tr> </table> <blockquote> <pre><big></big>function doPreload(){ var the_images = new Array('kwmatt.jpg','matbon.jpg','lunchMat.jpg'); preloadImages(the_images);}function preloadImages(the_images_array) { for(loop = 0; loop < the_images_array.length; loop++) { var an_image = new Image(); an_image.src = the_images_array[loop]; }}</pre> </blockquote> <table width="466"> <tr> <td width="462"><tt><font face="verdana, arial" size="3">doPreload()</font></tt><font size="3">函数创建了需要预装的图象名的数组，并把数组<br> 作为参数传送到<font face="verdana, arial"><tt>preloadImages()</tt></font>函数<font face="verdana, arial">, <tt>preloadImages()</tt></font>函数包<br> 含了一个循环，每次循环都创建一个新的图象对象，并把图象<br> 名设到它的<font face="verdana, arial">src</font>属性中。 <p><font face="verdana, arial"></font>不很难吧？图象对象相当有用对吧？我很高兴你这样想，休息<br> 一会儿，马上我们就要进入一个更令人兴奋，更让人动脑筋的<br> 话题：创建你自己的对象。<a href="day4_5.html">>></a> </font></td> </tr> </table> <p align="left"><font face="宋体" size="3" color="#000000"><strong>JavaScript高级教程</strong></font><font color="#FF0000" face="宋体" size="3"><br> </font><font size="3"><font color="#FF3300">第一页</font> <a href="day4_1.html"><font face="verdana, arial, geneva, sans-serif">JavaScript</font>高级教程<font face="verdana, arial, geneva, sans-serif">- </font>第<font face="verdana, arial, geneva, sans-serif">4</font>天</a> <br> <font color="#FF3300">第二页 </font><a href="day4_2.html">图象映射与<font face="verdana, arial, geneva, sans-serif">JavaScript</font></a><font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第三页 </font><a href="day4_3.html">预装图象 - 是什么<font face="verdana, arial, geneva, sans-serif">?</font></a><font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第四页 </font>预装图象 - 怎么做?<font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第五页 </font><a href="day4_5.html">对象的优点</a><br> <font color="#FF3300">第六页 </font><a href="day4_6.html">创建你自己的对象</a><br> <font color="#FF3300">第七页 </font><a href="day4_7.html">你的面向对象的虚拟宠物</a><br> <font color="#FF3300">第八页 </font><a href="day4_8.html">计算字符串</a><br> <font color="#FF3300">第九页 </font><a href="day4_9.html">获取难以索引的对象</a><br> <font color="#FF3300">第十页 </font><a href="day4_10.html">另一种获取难以索引的对象的手段</a><br> <font color="#FF3300">第十一页 </font><a href="day4_11.html">第四天课程复习</a></font></p> <p>[<a href="day1_1.html">第1课</a>][<a href="day2_1.html">第2课</a>][<a href="day3_1.html">第3课</a>][第4课][<a href="day5_1.html">第5课</a>]</p> <hr align="left"> <!--webbot bot="Include" U-Include="../../copyright.html" TAG="BODY" startspan --> <p><font face="verdana, arial, geneva, sans-serif" size="2"><a href="http://phtshop.yeah.net" target="_top">本文根据 网猴 相关文章改编，版权归原作者所有。</a> </font><font color="#000000"><span class="smallfont"></span></font></p> <!--webbot bot="Include" endspan i-checksum="15926" --> </td> </tr> <tr> </tr> </table></div></body></html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -