JavaScript - 传统DOM

这是在早期版本的 JavaScript 语言中引入的模型。它受到所有浏览器的良好支持，但只能访问文档的某些关键部分，例如表单、表单元素和图像。

此模型提供了一些只读属性，例如 title、URL 和 lastModified，这些属性提供有关整个文档的信息。除此之外，此模型还提供了各种方法，可用于设置和获取文档属性值。

传统 DOM 中的文档属性

以下是可以使用传统 DOM 访问的文档属性列表。

序号	属性和描述
1	alinkColor 已弃用 - 指定活动链接颜色的字符串。例 - document.alinkColor
2	anchors[ ] 一个 Anchor 对象数组，每个对象对应文档中出现的一个锚点。例 - document.anchors[0]，document.anchors[1] 等等
3	applets[ ] 一个 Applet 对象数组，每个对象对应文档中出现的一个 applet。例 - document.applets[0]，document.applets[1] 等等
4	bgColor 已弃用 - 指定文档背景颜色的字符串。例 - document.bgColor
5	cookie 一个具有特殊行为的字符串值属性，允许查询和设置与该文档关联的 Cookie。例 - document.cookie
6	domain 一个字符串，指定文档所在的互联网域名。用于安全目的。例 - document.domain
7	embeds[ ] 一个对象数组，表示使用 <embed> 标签嵌入到文档中的数据。与 plugins[ ] 同义。一些插件和 ActiveX 控件可以使用 JavaScript 代码控制。例 - document.embeds[0]，document.embeds[1] 等等
8	fgColor 已弃用 - 指定文档默认文本颜色的字符串。例 - document.fgColor
9	forms[ ] 一个 Form 对象数组，每个对象对应文档中出现的一个 HTML 表单。例 - document.forms[0]，document.forms[1] 等等
10	images[ ] 一个 Image 对象数组，每个对象对应使用 HTML <img> 标签嵌入到文档中的一个图像。例 - document.images[0]，document.images[1] 等等
11	lastModified 一个只读字符串，指定文档最近更改的日期。例 - document.lastModified
12	linkColor 已弃用 - 指定未访问链接颜色的字符串。例 - document.linkColor
13	links[ ] 这是一个文档链接数组。例 - document.links[0]，document.links[1] 等等
14	location 文档的 URL。已弃用，建议使用 URL 属性。例 - document.location
15	plugins[ ] 与 embeds[ ] 同义例 − document.plugins[0]、document.plugins[1] 等等
16	Referrer（来源URL）一个只读字符串，包含当前文档链接到的文档（如果存在）的 URL。例 − document.referrer
17	标题 <title> 标签的文本内容。例 − document.title
18	URL 一个只读字符串，指定文档的 URL。例 − document.URL
19	vlinkColor（访问链接颜色）已弃用 − 指定已访问链接颜色的字符串。例 − document.vlinkColor

传统 DOM 中的文档方法

以下是传统 DOM 支持的方法列表。

序号	属性和描述
1	clear( ) 已弃用 − 清空文档内容并返回空值。例 − document.clear( )
2	close( ) 关闭使用 open( ) 方法打开的文档流，并返回空值。例 − document.close( )
3	open( ) 删除现有文档内容并打开一个流，可向其中写入新的文档内容。返回空值。例 − document.open( )
4	write( value, ...) 将指定的字符串插入到当前正在解析的文档中，或附加到使用 open( ) 打开的文档中。返回空值。例 − document.write( value, ...)
5	writeln( value, ...) 与 write( ) 相同，不同之处在于它会在输出中附加一个换行符。返回空值。例 − document.writeln( value, ...)

示例

我们可以使用 HTML DOM 定位任何 HTML 文档中的任何 HTML 元素。例如，如果网页文档包含一个 form 元素，那么使用 JavaScript 可以将其引用为 document.forms[0]。如果您的网页文档包含两个 form 元素，则第一个表单被称为 document.forms[0]，第二个被称为 document.forms[1]。

使用上面给出的层次结构和属性，我们可以使用 document.forms[0].elements[0] 等访问第一个表单元素。

这是一个使用传统 DOM 方法访问文档属性的示例。

在线演示

<html>
   
   <head>
      <title> Document Title </title>
      
      <script type = "text/javascript">
         <!--
            function myFunc() {
               var ret = document.title;
               alert("Document Title : " + ret );
            
               var ret = document.URL;
               alert("Document URL : " + ret );
            
               var ret = document.forms[0];
               alert("Document First Form : " + ret );
            
               var ret = document.forms[0].elements[1];
               alert("Second element : " + ret );
            }
         //-->
      </script>
      
   </head>
   
   <body>
      <h1 id = "title">This is main title</h1>
      <p>Click the following to see the result:</p>
      
      <form name = "FirstForm">
         <input type = "button" value = "Click Me" onclick = "myFunc();" />
         <input type = "button" value="Cancel">
      </form>
      
      <form name = "SecondForm">
         <input type = "button" value = "Don't ClickMe"/>
      </form>
      
   </body>
</html>

输出

注意 − 此示例为表单和元素返回对象，我们将不得不使用本教程中未讨论的对象属性来访问其值。

javascript_html_dom.htm

打印页面

序号	属性和描述
1	alinkColor 已弃用 - 指定活动链接颜色的字符串。例 - document.alinkColor
2	anchors[ ] 一个 Anchor 对象数组，每个对象对应文档中出现的一个锚点。例 - document.anchors[0]，document.anchors[1] 等等
3	applets[ ] 一个 Applet 对象数组，每个对象对应文档中出现的一个 applet。例 - document.applets[0]，document.applets[1] 等等
4	bgColor 已弃用 - 指定文档背景颜色的字符串。例 - document.bgColor
5	cookie 一个具有特殊行为的字符串值属性，允许查询和设置与该文档关联的 Cookie。例 - document.cookie
6	domain 一个字符串，指定文档所在的互联网域名。用于安全目的。例 - document.domain
7	embeds[ ] 一个对象数组，表示使用 <embed> 标签嵌入到文档中的数据。与 plugins[ ] 同义。一些插件和 ActiveX 控件可以使用 JavaScript 代码控制。例 - document.embeds[0]，document.embeds[1] 等等
8	fgColor 已弃用 - 指定文档默认文本颜色的字符串。例 - document.fgColor
9	forms[ ] 一个 Form 对象数组，每个对象对应文档中出现的一个 HTML 表单。例 - document.forms[0]，document.forms[1] 等等
10	images[ ] 一个 Image 对象数组，每个对象对应使用 HTML <img> 标签嵌入到文档中的一个图像。例 - document.images[0]，document.images[1] 等等
11	lastModified 一个只读字符串，指定文档最近更改的日期。例 - document.lastModified
12	linkColor 已弃用 - 指定未访问链接颜色的字符串。例 - document.linkColor
13	links[ ] 这是一个文档链接数组。例 - document.links[0]，document.links[1] 等等
14	location 文档的 URL。已弃用，建议使用 URL 属性。例 - document.location
15	plugins[ ] 与 embeds[ ] 同义例 − document.plugins[0]、document.plugins[1] 等等
16	Referrer（来源URL）一个只读字符串，包含当前文档链接到的文档（如果存在）的 URL。例 − document.referrer
17	标题 <title> 标签的文本内容。例 − document.title
18	URL 一个只读字符串，指定文档的 URL。例 − document.URL
19	vlinkColor（访问链接颜色）已弃用 − 指定已访问链接颜色的字符串。例 − document.vlinkColor

序号	属性和描述
1	clear( ) 已弃用 − 清空文档内容并返回空值。例 − document.clear( )
2	close( ) 关闭使用 open( ) 方法打开的文档流，并返回空值。例 − document.close( )
3	open( ) 删除现有文档内容并打开一个流，可向其中写入新的文档内容。返回空值。例 − document.open( )
4	write( value, ...) 将指定的字符串插入到当前正在解析的文档中，或附加到使用 open( ) 打开的文档中。返回空值。例 − document.write( value, ...)
5	writeln( value, ...) 与 write( ) 相同，不同之处在于它会在输出中附加一个换行符。返回空值。例 − document.writeln( value, ...)