⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 day3_5.html

📁 成为真正的网页制作的高手的话,必须了解并使用DHTML.这里提供了最好的手册和文档.
💻 HTML
字号:
🔍 
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb_2312-80">
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<style type="text/css">
<!--
a:link {  color: blue; text-decoration: none}
a:visited {  color: purple; text-decoration: none}
a:hover {  color: purple; text-decoration: underline}
.unnamed1 {  font-family: "宋体"; font-size: 9pt}
-->
</style>
<style> 
<!--#menu {position: absolute;
left: 1px;top: 174px;width: 163px;height: 300px;}
-->
</style>
<style> 
<!--#content {position: absolute;
left: 175px;top: 184px;width: 435px;height: 300px;}
-->
</style>
<title>网猴：动态HTML</title>
</head>

<body bgcolor="#FFFFFF">
<div id="content" style="left: 18px; top: 22px"> 
  <p> <font size="4"></font></p>
  <table border="0" width="600" cellspacing="0">
    <tr> 
      <td bgcolor="#ffff99" colspan="2"><font size="4" color="#000000"><strong>动态HTML教程 
        - 第三天</strong></font></td>
    </tr>
    <tr> 
      <td bgcolor="#FF6600" colspan="2"><em><font size="4"><a href="mailto:taylor@taylor.org">Taylor</a> 
        </font><font size="3">1998.3.9</font></em></td>
    </tr>
  </table>
  <p><strong><font size="3" face="宋体">第五页：访问对象的一个技巧</font></strong></p>


<p><font size="3"><font face="宋体">现在你已经可以在页面中移动对象了。 
但是如果你需要将<br>
多个对象按照特定的顺序移动或者执行多个事件触发的行<br>
为时，不仅的代码体积会增加（每次访问一个对象时你都必<br>
须使用一次if/then 语句），而且每次都必须为某个行为键<br>
入<i>document.truck.left</i> 是一件很烦人的事。在Netscape模<br>
块中，当你嵌入<tt>DIV</tt>时，文件对象模块的层次结构就会增<br>
加，如下： </font>

<ul>
  <pre><font face="宋体">&lt;div id=&quot;foo&quot;&gt;

   &lt;div id=&quot;bar&quot;&gt;

      &lt;div id=&quot;sna&quot;&gt;

      &lt;/div&gt;

   &lt;/div&gt;

&lt;/div&gt;</font></pre>
</ul>

<p><font face="宋体">要访问<tt>foo</tt>，则必须执行<tt>document.foo</tt>, 
而要访问<tt>bar</tt>，则必<br>
须执行<tt>document.foo.document.bar</tt>。而要访问<tt>sna</tt>，则必须<br>
执行<tt>document.foo.document.bar.document.sna。</tt></font></p>

<p><font face="宋体">我快要受不了啦啦啦！！！</font></p>

<p><font face="宋体">所以你必须解决引用对象时造成的代码体积膨胀的问题，还<br>
得避免每次移动一个对象时必须设定条件。但你可以用一个<br>
技巧解决这个问题。</font></p>

<p><font face="宋体">任何用JavaScript编写过网页的人都知道任何打开一个小<br>
窗口：</font> 

<ul>
  <pre><font face="宋体">windowID = window.open('name', 'http://blah.com/');</font></pre>
</ul>

</font><p><font size="3"><font face="宋体">这项指令就可打开一个小窗口，但是你还可以通过使<br>
用<tt>windowID</tt> 作一个引用在继续控制追赶窗口。例<br>
如</font></font><font size="3" face="宋体"><tt>windowID.location = 
'http://www.taylor.org/</tt></font><font size="3"><font face="宋体">就可以<br>
改变窗口资源的定位。<tt>&quot;windowID.close()&quot;</tt>就可关闭该窗<br>
口。你所做的只是对一个Javascript对象设置一个引用。在<br>
动态HTML中也可以使用同样的技巧。 </font></font></p><font size="3">

<p><font face="宋体">你可能会注意到在上一页的图表中，大多数定位属性的语法<br>
都很相似。只不过它们被用在了不同的对象上。我们可以用<br>
一个JavaScript例程解决上面的问题。</font> 

<ul>
  <pre><font face="宋体">&lt;script&gt;

function setup(){

   if(document.layers){

      daTruck = document.truck;

   } else if(document.all) {

      daTruck = truck.style;

   }

}

&lt;/script&gt;</font></pre>
</ul>

<p><font face="宋体">现在<tt>moveIt</tt>函数可以被改为</font> 

<ul>
  <pre><font face="宋体">function moveIt() {

   daTruck.left = parseInt(daTruck.left) - 5;

   if(parseInt(daTruck.left) &lt; 0){

      daTruck.left = 480;

   }

   setTimeout('moveIt()', 100);

}</font></pre>
</ul>

<p><font face="宋体">代码短了一些，对吧？下面我们将使页面这些图象都动起来。</font></p>
</font>

<p><a href="day3_6.html">&gt;&gt;</a></p>

<p><font size="3" face="宋体"><strong>动态HTML教程<br>
</strong><font color="#FF0000">第一页</font> <a href="day3_1.html">动态HTML教程 - 
第三天</a><br>
<font color="#FF0000">第二页</font> <a href="day3_2.html">微软和网景不同的语法</a><br>
<font color="#FF0000">第三页</font> <a href="day3_3.html">使其在两种浏览器中都可用</a><br>
<font color="#FF0000">第四页</font> <a href="day3_4.html">脚本如何运行</a><br>
<font color="#FF0000">第五页</font> 访问对象的一个技巧<br>
<font color="#FF0000">第六页</font> <a href="day3_6.html">制作网猴们互相追赶的动画效果</a></font></p>

<p><font size="3">[<a href="day1_1.html">第1天</a>][第2天][<a href="day3_1.html">第3天</a>][<a href="day4_1.html">第4天</a>][<a href="day5_1.html">第5天</a>]</font></p>
  <font size="3"> 
  <hr>
  </font><font face="verdana, arial, geneva, sans-serif" size="2"><a href="http://phtshop.yeah.net" target="_top"><br>
  </a>本文由<a href="http://chd.126.com" target="_blank">《CHD的网络教室》</a>根据<a href="http://www.webmonkey.com.cn" target="_blank">《网猴》</a>相关文章改编，版权归<a href="http://www.webmonkey.com.cn" target="_blank">《网猴》</a>所有</font><font size="3"> 
  </font></div>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -