DOM树的结构节点与元素
DOM树结构
DOM树是一个层次化的树形结构，用于表示HTML或XML文档。每个文档会被解析成由节点组成的树形结构，顶层节点为文档节点（document），其下包含元素节点、文本节点、属性节点等。通过操作这些节点，可以动态更新文档的内容和结构。
1、节点类型
文档节点（Document Node）：整个文档的根节点，是DOM树的起点。
通过document对象访问。
var doc = document;
2、元素节点（Element Node）：代表HTML或XML标签。
可以包含其他节点，如属性节点和文本节点。
<div id="myDiv">Hello, World!</div>
对应的javascript获取代码：
var element = document.getElementById('myDiv');3、属性节点（Attribute Node）：代表元素的属性，包含属性名和属性值。
在现代DOM中，属性节点一般通过元素节点直接访问。
<div id="myDiv" class="container"></div>
javascript对应获取代码：
var element = document.getElementById('myDiv');
var classAttribute = element.getAttribute('class');4、文本节点（Text Node）：代表元素或属性中的文本内容。
是DOM树的叶子节点，不包含子节点。
<p>Hello, World!</p>
javascript对应获取代码：
var textNode = document.createTextNode('Hello, World!');5、注释节点（Comment Node）：
代表HTML或XML文档中的注释。
<!-- This is a comment -->
对应的javascript代码：
var commentNode = document.createComment('This is a comment');6、文档片段节点（DocumentFragment Node）：
代表一个轻量级的文档对象，常用于批量操作DOM以提高性能。
var fragment = document.createDocumentFragment();
需要购买本课才能留言哦~