📄 page1.html
字号:
</tr>
<tr>
<td colspan="2">-<a href="../../1-graphics/index.html">图形与字体</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1multimedia/index.html">多媒体教程</a></td>
</tr>
<tr>
<td colspan="2"><a href="../../1-os/index.html">-操作系统</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-e_business/index.html">电子商务</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-director/index.html">Director</a> </td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#666699"><a href="../../1-download/index.htm"><font color="#FFFFFF">网猴下载</font></a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-download/page1.htm">网页制作</a></td>
</tr>
<tr>
<td colspan="2">-<font color="#000000"><a href="../../1-download/page2.htm">程序设计</a></font></td>
</tr>
<tr>
<td colspan="2">-<font color="#000000"><a href="../../1-download/page3.htm">网站设计</a></font></td>
</tr>
<tr>
<td colspan="2">-<font color="#000000"><a href="../../1-download/page4.htm">电子商务</a></font>
</td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#666699"><a href="../../1-teach/index.htm"><font color="#FFFFFF">实用技巧</font></a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/internet/index.htm">Internet应用</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/photoshop/index.html">Photoshop</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/flash/page1.html">Flash</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/asp/index.html">ASP</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/php/index.html">PHP</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/java/index.htm">Java</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/vb/index.htm">VB</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/c/index.htm">C、C++</a></td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-backend/database/php_mysql/index.html">PHP/MySQL</a></td>
</tr>
<tr>
<td colspan="2"><a href="../../1-backend/cgi_perl/perl_beginner/index.html">-Perl</a>
</td>
</tr>
<tr>
<td colspan="2">-<a href="../../1-teach/other/index.htm">其它</a> </td>
</tr>
<tr>
<td colspan="2" bgcolor="#666699">
<div align="center"><font color="#FFFFFF">更多教程</font></div>
</td>
</tr>
<tr>
<td colspan="2" height="17"><a href="../../1hdml/index.html">-HDML</a></td>
</tr>
<tr>
<td colspan="2" height="23"><font face="宋体"><a href="../../1-backend/database/course/day1_1.html">-网络数据库</a></font></td>
</tr>
<tr>
<td colspan="2" height="14"><a href="../../1-backend/protocols/ping/index.html"><font face="arial, helvetica, sans-serif">Ping</font></a></td>
</tr>
<tr>
<td colspan="2" height="20"><a href="../../1-backend/cgi_perl/search_engine/index.html">-创建搜索引擎</a></td>
</tr>
<tr>
<td colspan="2" height="16">-<a href="../../1adobe/GoLive/index.html">Adobe GoLive</a></td>
</tr>
<tr>
<td colspan="2"><a href="../../1-backend/cgi_perl/templates/index.html">模板</a></td>
</tr>
<tr>
<td colspan="2" align="center" bgcolor="#666699"><font color="#FFFFFF">合作伙伴</font></td>
</tr>
<tr>
<td colspan="2" align="left">-<a href="http://www.5dmedia.com/" target="_blank">5D精英网</a></td>
</tr>
<tr align="center">
<td colspan="2"> <img src="../../Library/front_monkey.gif" width="59" height="68"></td>
</tr>
</tbody>
</table>
<br><!-- #EndLibraryItem --></td>
<!-- End of headlines (column 1: left column) --> <!-- Gutter between columns 1 and 2 -->
<td width="10" height="794"><img src="http://www.sohu.com/images/pixel.gif" width=10></td>
<!-- Search box and directories (columns 2 and 3: middle columns, combined into one) -->
<td align=center valign=top width="558">
<div align="left"><!-- #BeginEditable "1" --><font color="#000000"><font color="#FF0000"><b><font color="#000000">文本对象模块(DOM)介绍</font></b></font><b><br>
</b><b><br>
<br>
</b><font color="#FF0000">第一页<b>:</b>什么是文本对象模块?</font><b> <br>
</b></font>
<hr noshade>
<font color="#000000">文本对象模块如何允许你描述网页中的内容?为什么说文本对象模块功能强大?你怎样在不提及网页内容的情况下实现对网页的描述?
一种方法是描述网页的结构。那么网页使用何种置标符呢?有多少种置标符?它们有何顺序要求?这些置标符的属性是什么?以及各元素的直观特性是什么?
以上这些问题均可以由文本对象模块(DOM)来解答,它使用一种通用文本模式对HTML文件的结构进行描述。<br>
<br>
我为Webmonkey制作的第一个网页特效是一些频繁闪烁变换的图片,我采用的方法是创建一些图片,在网页中通过设置许多图片置标符将它们指向不同的图片,这样由计算机随机按每秒几幅图片的频率不断变换图片内容,从而实现闪烁变换效果。当时我对自己创造出的特效还是很满意的。<br>
<br>
但当时我还不清楚我已经在不知情的情况下使用了文本对象模块技术。网页中有一些对象,脚本语言对图片进行查询,并修改相应的对象属性,这就是文本对象模块的工作模式。
但这只是在Netscape 3版本中可以实现的功能,你可以读取并编写图片的属性和锚(anchor)标记,可以查询浏览器本身的一些信息,例如浏览器可接收何种类型的MIME(多用途网际邮件扩充协议),浏览器中内建了哪些插件,插件的位置,以及一些其它信息。<br>
<br>
也就是说在Netscape 3中,文本对象模块具备的只是一些非常简洁基础实用的功能。 Netscape Navigator 4中引入了一些新的功能,可以实现文本内容的交互功能。它提供了层面(layer)置标符,可以创建树形分级架构;它还提供了更多更新的查询layers置标符、div置标符和窗口自身宽度和高度的方法。这些新增功能可以允许你对网页有更好的操控能力,在网页加载过程中或某段时间内实现你所希望的效果。<br>
<br>
最近,文本对象模块又被加入到JavaScript脚本中,因为如果你想让任何其它元素(如Java applets, plug-ins等)对文本对象模块进行操控,就必须实现文本对象模块与JavaScript脚本编辑引擎的结合。而Netscape把文本对象模块与JavaScript的结合称为LiveConnet。
在Navigator浏览器中,你最好还是把文本对象模块看做JavaScript脚本中的一个函数,因为该模块的语法就是JavaScript语言,对象群体看起来以及在执行过程中也非常象群组对象。因此对很多人来说,他们认为网页中的文本对象模块和JavaScript脚本两者间没有什么明显的区别。
接着Microsoft公司发布了Internet Explorer 4.0版本浏览器,IE浏览器的文本对象模块有了非常大的变化,为此我专门学习了相关内容。<br>
<br>
Internet Explorer 4.0将文本对象模块从脚本语言中提取出来直接置入浏览器内,这样网页中并没有表示不同对象概念的一种语言,取而代之的是浏览器本身存储了这种架构和表现方式,将信息打开至一个脚本编辑语言中,或者直接对内容进行编辑从而实现读取和操控的功能。你根本不必清楚div置标符被存储在JavaScript脚本中的哪个部位,你会发现它们的存储位置与在VBScript脚本中的位置不同,因为所有的信息都具有统一的格式。
你可以非常简单地通过使用JavaScript脚本对HTML网页进行编辑,就象使用VBScript脚本、Java applet、ActiveX、Cobol等一样。<br>
<br>
这种新的文本对象模块并不仅仅应用于"anchors"、图片以及嵌入式置标符,它还可以控制网页的整体架构。因此如果你想查找网页中有多少</font>置标符,或希望将网页中第五段内容变为蓝色,或者修改列表元素的CSS-P变量值以便使其实现很酷的"wipes"(擦除)特效,你需要操控的对象将是相同的,你使用的语言就是实现这种结果的方法。
<br>
<br>
<b>文本对象模块的用途</b><br>
<br>
我以前曾经在Wired Digital网站介绍过文本对象模块的概念,也曾经对我一些制作网页的朋友谈起过文本对象模块,我发现掌握文本对象模块这个新知识的难点之一在于让人们了解它的用途。如果你仅把文本对象模块看作是脚本和文本的一个中间载体,那么你就会认为文本对象模块只是一个普通的语言句法,但实际上文本对象模块远不止这些功能。<br>
<br>
如果说样式表可以允许你脱离网页内容和架构来控制整个网页的布局和显示效果,那么文本对象模块则是允许你脱离网页内容和架构实现信息交互的利器。它的工作原则与样式表相同,但采用编码方式,这种方式的好处在于它可以允许你对已有的网页进行修改,添加各种你的老板希望看到的新奇效果。<br>
<br>
<font color="#000000"> <a href="index.html">首页</a><br>
</font>
<table width="99%" border="0">
<tr>
<td width="47%">1)<font color="#FF0000">第一节:什么是文本对象模块?</font></td>
<td width="53%">2)<a href="page2.html">第二节:文本对象模块的内容</a></td>
</tr>
</table>
<font color="#000000"> </font><!-- #EndEditable --></div>
</td>
<!-- End of search box and directories (columns 2 and 3: middle columns, combined into one) -->
<!-- Gutter between columns 3 and 4 --> <!-- Other stuff (column 4: right column) -->
<!-- End of other stuff (column 4: right column) --> </tr>
</table>
<!-- End of table surrounding page contents -->
<hr noshade size=1 width=700>
<span class=eng><br>
Copyright (C) 1998-2000 Internet Technologies China. All rights reserved.
</span>
</center>
</body>
<!-- #EndTemplate --></html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -