本文共 1892 字，大约阅读时间需要 6 分钟。

DOM(Document Object Model 文档对象模型)可以完成HTML和XML文档的操作，在JavaScript中利用DOM操作HTML和CSS样式是最常用的样式之一。DOM对JavaScript是一种可操作HTML文档得重要手段。利用DOM可完成对HTML文档内所有元素的获取、访问、标签属性和样式的设置等操作。

根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点： 1、整个文档是一个文档节点 2、每个 HTML 元素是元素节点 3、HTML 元素内的文本是文本节点 4、每个 HTML 属性是属性节点 5、注释是注释节点 下面以、、节点为例进行介绍 （1）根节点：标签是整个文档的根节点，有且仅有一个。 （2）子节点：指的是某个节点的下级节点，例如·和节点是节点的子节点。 （3）父节点：指的是某个节点的上级节点，例如是和body的父节点 （4）兄弟节点：两个节点同属于一个父节点，例如和互为兄弟节点

一个HTML文件可以看作是所有元素组成的一个节点树，各元素节点之间有级别的划分

                      测试                   链接         

段落.......

在JavaScript中要对网页中的元素进行操作，可以利用document对象的getElementById()方法实现，下列代码test表示要操作的对象，test对象是HTMLDivElement构造函数的实例。通过控制台查看对象的原型，可以得到DOM对象之间的继承关系。

                     var = test ; test=document.getElementById('test');             console.log(test);              console.log(test.__proto__);          

document对象和Element对象均继承Node对象(节点对象)，是两种不同类型的节点对象，不仅能够使用Node对象的一系列属性和方法完成节点操作，也可以使用特有的属性和方法完成不同类型节点的操作。  

document对象的方法：

document.getElementById()   返回对拥有指定id的第一个对象的引用

document.getElementsByName()   返回带有指定名称的对象集合

document.getElementsByTagName()    返回带有指定标签名的对象集合

document.getElementsByClassName()    返回带有指定类名的对象集合（不支持IE6-8）

除document.getElementById()方法返回的是拥有指定id的元素外，其他方法返回的都是符合要求的一个集合。

除document对象的getElementById()方法返回的是一个对象box外，其余三个方法返回的都是对象集合，若要获取其中一个对象，可以通过下标的方式获取，默认从0开始。

document对象提供一些属性，可用于获取文档中的元素。例如：获取所有表单标签、图片标签等。 document对象的属性：

document.body    返回文档的body元素

document.documentElement    返回文档的html元素

document.forms    返回对文档中所有Form对象引用

document.images    返回对文档中所有Images对象引用

innerHTML属性    设置或返回元素开始和结束标签之间的HTML

innerText属性    设置或返回元素中去除所有标签的内容

textContent属性    设置或返回指定节点的文本内容

document.write()方法·    向文档写入指定内容

document.writeIn()方法    向文档写入指定的内容后换行

转载地址：https://blog.csdn.net/weixin_73646899/article/details/127024125 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！