JavaScript文档对象模型或DOM


每个网页都驻留在浏览器窗口中,该窗口可被视为一个对象。

Document对象代表在该窗口中显示的HTML文档。 Document对象具有引用其他对象的各种属性,这些属性允许访问和修改文档内容。

文档内容的访问和修改方式称为文件对象模型,或者DOM。对象按层次结构组织。此层次结构适用于Web文档中对象的组织。

  • 窗口对象(window):层次结构的顶部。它是对象层次结构的最外层元素。

  • 文件对象(document):每个加载到窗口中的HTML文档都成为一个文档对象。该文档包含页面的内容。

  • 表单对象(form):<form>...</form>标签所包含的所有内容都是在设置表单对象。

  • 表单控制元素:表单对象包含为该对象定义的所有元素,例如文本字段,按钮,单选按钮和复选框。

存在几种DOM。以下各节详细说明了每个DOM,并描述了如何使用它们来访问和修改文档内容。

  • 旧版DOM :这是在JavaScript语言的早期版本中引入的模型。所有浏览器都很好地支持它,但是只允许访问文档的某些关键部分,例如表单,表单元素和图像。

  • W3C DOM :此文档对象模型允许访问和修改所有文档内容,并由万维网联盟(W3C)进行了标准化。几乎所有现代浏览器都支持此模型。

  • IE4 DOM :此文档对象模型是在Microsoft的Internet Explorer浏览器的版本4中引入的。 IE 5和更高版本包括对大多数基本W3C DOM功能的支持。

DOM兼容性


如果要编写一个灵活使用W3C DOM或IE 4 DOM的脚本(取决于它们的可用性),则可以使用功能测试方法,该方法首先检查方法或属性的存在以确定浏览器是否具有你想要的能力。例如:

if (document.getElementById) {
    //如果存在W3C方法,请使用它
} else if (document.all) {
    //如果all []数组存在,请使用它
} else {
    //否则使用旧版DOM
}