你的第一个反映可能是假定下载过程中断了。但是实际上是IE把这个整体分离。因为如果你查看文档,对象foo并没有样式在其中,虽然它有一个指向样式表的ID。所以foo的唯一属性是ID。你可以做一个实验,在foo标记中加入:
This is the sample
现在alert(foo.bar)会返回"neat"。你看出来在IE中发生什么了吗?标记中的任何属性都在DOM中作为对象的属性出现。但是如果它不在对象内,就在DOM中没有反映。这就是为什么把样式加到标记中。
为了修正这个问题,我们再一次使用JavaScript的object-as-reference能力。但是不指向HTML对象,我们
为按照ID为对象指定样式表规则。页面的结果和在你的脚本中的一致,但是不需要把样式放在标记行中。
结果是循环经过所有的页面的样式表。如果其中一个与你的对象的ID匹配,它就作为这个对象的别名。你可以象从前一样处理,但是用的HTML代码更整洁。
在你完全掌握dHTML前,你需要了解event对象。两种4.0浏览器都包含event对象。它在事件创立时产生,如点击一个可点击的对象,移动鼠标,或聚焦到一个窗体元素上。Event对象被创建然后传递给处理事件的函数。
下面是event对象属性的描述,以及Netscape和IE处理它们的方式:

4.0浏览器也增加了处理事件的新方法,虽然它们(Netscape和IE)的方式不同。Netscape用的是“时间捕捉”,IE用的是“事件气泡”。
事件处理对Netscape处理如mouseMove或keyPress等事件是必须的,它并不隐含指向一个标记或元素。你应该告诉客户注意这些事件,并告诉它用什么函数来处理它们。下面例子用window对象的captureEvents方法来描述正在捕捉的事件:
window.captureEvents(Event.MOUSEMOVE);
注意到在不用on作为名称一部分的情况下特定事件是如何被指向的。你只是告诉Netscape注意所有发生在窗口中的事件并捕捉它们。然后你需要告诉Netscape用这些被捕捉的时间做些什么。注意on又出现了。
window.onMouseMove = handlerFunction;
function handerFunction(yourEvent) {
alert(yourEvent.screenX);
}
这段代码是一个演示事件过程的烦人的例子。每次你移动鼠标,一个对话框会跳出来告诉你它的横坐标位置。以这种方式处理的事件传递一个指针到event对象。从这儿你可以获取必要的信息。一旦你厌倦了捕捉事件,你可以象这样释放它们:
window.releaseEvents(Event.MOUSEMOVE);
于是这种类型的事件不再被捕捉。
IE用不同的方法处理事件,叫做“事件气泡”。在这种方法中,如果你有这样一个结构:
Click on me
如果你点击strong标记内的文本,它接收到一个onClick事件,然后发送onclick事件给标记,处理它然后发送到
标记,等等,然后直到窗口。这样每个元素以自己的方式处理点击。但是如果你想停止气泡上传,可以取消气泡。
所以如果你不想让某个事件传递到所有它包含的标记,可以象上面那样阻止它。
你可以看到,因为两种浏览器存在相似的事件,每一步都需要大量的条件化工作,而且没有简单的方式把它们映射到一个句法中。
虽然动态HTML背后有很多要了解的,但是你现在已经可以开始并使dHTML适应不同的浏览器。如果你想了解更多的内容,Microsoft和Netscape在它们的网站上都有扩展dHTML文档。
那么你觉得动态HTML怎样?爱它还是恨它?爱它所做的,但是在实现上的差异上又心存顾虑?事实上浏览器公司和World Wide Web Consortium已经意识到这种差异,所以将来应该有解决办法。
最后,有一项期末作业:
做一个动态HTML主页,让它运动、让它可视和隐藏、让它反应用户事件。
祝你编码和设计快乐!