W3C DOM和JavaScript[转]

W3C DOM和JavaScript很容易混淆不清。DOM是面向HTML和XML文档的API，为文档提供了结构化表示，并定义了如何通过脚本来访问文档结构。JavaScript则是用于访问和处理DOM的语言。如果没有DOM，JavaScript根本没有Web页面和构成页面元素的概念。文档中的每个元素都是DOM的一部分，这就使得JavaScript可以访问元素的属性和方法。

DOM独立于具体的编程语言，通常通过JavaScript访问DOM，不过并不严格要求这样。可以使用任何脚本语言来访问DOM，这要归功于其一致的API。表3-1列出了DOM元素的一些有用的属性，表3-2列出了一些有用的方法。

表3-1  用于处理XML文档的DOM元素属性

属性名


描述

childNodes


返回当前元素所有子元素的数组

firstChild


返回当前元素的第一个下级子元素

lastChild


返回当前元素的最后一个子元素

nextSibling


返回紧跟在当前元素后面的元素

nodeValue


指定表示元素值的读/写属性

parentNode


返回元素的父节点

previousSibling


返回紧邻当前元素之前的元素

表3-2　用于遍历XML文档的DOM元素方法

方法名


描述

getElementById(id) (document)


获取有指定惟一ID属性值文档中的元素

getElementsByTagName(name)


返回当前元素中有指定标记名的子元素的数组

hasChildNodes()


返回一个布尔值，指示元素是否有子元素

getAttribute(name)


返回元素的属性值，属性由name指定

有了W3C DOM，就能编写简单的跨浏览器脚本，从而充分利用XML的强大功能和灵活性，将XML作为浏览器和服务器之间的通信介质。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

以下转自：http://book.51cto.com/art/200903/114688.htm

12.1.3  浏览器对象模型

从12.1.2小节中可以看出，在JavaScript中对象之间并不是独立存在的，对象与对象之间有着层次关系。如Document对象是Window对象的子对象，Window对象是Document对象的父对象等。

浏览器对象模型就是用于描述这种对象与对象之间层次关系的模型，该对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。图12-2是BOM的结构示意图。


（点击查看大图）图12-2  BOM的结构示意图

从图12-2中可以看出，Window对象是BOM中的顶层对象，该对象代表了浏览器窗口。在Window对象之下有下述几个子对象。

Document对象：该对象代表浏览器窗口中所加载的文档。使用Document对象可以操作文档中的内容。在整个BOM中，只有Document对象是与HTML文档的内容相关的。

Frames数组：该数组代表浏览器窗口中的框架。HTML中允许将一个浏览器窗口分为多个框架，每个框架中可以加载一个HTML文档。在这种框架页中，每一个框架都是Frames数组中的一个元素。而Frames数组中的每一个元素都是一个Window对象。

History对象：该对象代表当前浏览器窗口的浏览历史。通过该对象可以将当前浏览器窗口中的文档前进或后退到某一个已经访问过的URL（统一资源定位符）。

Location对象：该对象代表当前文档的URL。URL分为几个部分，如协议部分、主机部分、端口部分等。使用Location对象可以分别获得这些部分，并且可以通过修改这些部分的值来加载一个新文档。

Navigator对象：该对象是浏览器对象，代表了浏览器的信息。该对象与Window对象不同，Window对象可以用于控制浏览器窗口的一些属性，如浏览器窗口大小、位置等。而Navigator对象包含的是浏览器的信息，如浏览器的名称、版本号等。

Screen对象：该对象代表当前显示器的信息。使用Screen对象可以获得用户显示器的分辨率、可用颜色数量等信息。

Document对象代表HTML文档，而HTML文档中包括了有很多元素，BOM也将这些元素看成了不同的对象。从图12-2中可以看出，Document对象还有下述几个子对象。

Anchors数组：该数组代表了文档中的所有锚。数组中的每一个元素都是一个锚对象。每一个锚对象都对应着HTML文档中的一个包含name属性的<a>标签，通过锚对象可以获得锚的命名，以及超链接中的文字。

Applets数组：该数组代表了嵌在网页中的所有小程序。数组中的每一个元素都是一个Applet对象，通过Applet对象可以获得Java小程序的公有字段。

Embeds数组：与Applets类似，但建议使用Embeds数组。

Forms数组：该数组代表文档中的所有表单。数组中的每一个元素都是一个Form对象。每一个Form对象都对应着HTML文档中的一个<form>标签。通过Form对象可以获得表单中的各种信息，也可以提交或重置表单。由于表单中还包括了很多表单元素，因此，Form对象的子对象还可以对这些表单元素进行引用，以完成更具体的应用。

Images数组：该数组代表文档中的所有图片。数组中的每一个元素都是一个Image对象。每一个Image对象都对应着HTML文档中的一个<img>标签。通过Image对象可以获得图片的各种信息。

Links数组：该数组代表文档中的所有超链接。数组中的每一个元素都是一个Link对象。每一个Link对象都对应着HTML文档中的一个包含href属性的<a>标签，通过Link对象可以获得超链接中URL的各部分信息。

Location对象：该对象与Window对象中的Location对象完全相同。由于该对象与HTML文档并没有太大关系，因此，该对象是反对使用的对象，建议使用Window对象的Location子对象。

BOM并不是W3C中的标准，因此，不同的浏览器所支持的BOM中的对象、对象的属性和方法都有可能不同。从图12-2中可以看出，Document对象下有很多子对象，因此Document对象是一个十分重要的对象。事实上，大多数浏览器都支持Document对象。在W3C正式定义DOM之前，BOM中的Document分支就已经被众多浏览器支持。DOM被正式定义之后，分为了三个层次，分别为1级DOM（DOM Level 1）、2级DOM（DOM Level 2）和3级DOM（DOM Level 3）。而BOM中的Document分支被称为0级DOM（DOM Level 0），因为该分支定义了文档功能的基本功能。