DOM的结构

HTML的标签在DOM中都是一个个节点，而这些节点组成了DOM的整体结构——节点树。

DOM的结构与家谱的结构极其相似。

DOM_家谱

我们将这个结构称之为“节点树”。例如如下的HTML：

<html>
   <head>
   <title>HTML DOM</title>
   </head>
   <body>
   <h1>DOM的结构</h1>
   <p><a href="href">链接</a></p>
   </body>
</html>

它的DOM结构如下：

DOM节点树

节点

节点树

节点树的概念从图中一目了然，最上面的就是“树根”了。节点之间有父子关系，祖先与子孙关系，兄妹关系。这些关系从图中也很好看出来，直接连线的就是父子关系了。而有一个父亲的就是兄妹关系……

菜鸟的HTML DOM笔记目录

  1. DOM可以做什么？
  2. DOM的结构
  3. 访问DOM节点1——getElementById()
  4. 访问DOM节点2——getElementsByTagName()
  5. 访问DOM节点3——通过节点关系
  6. DOM节点信息
  7. DOM信息nodeType的应用
  8. 修改DOM——innerHTML
  9. 删除DOM节点——removeChild
  10. 添加DOM节点
  11. DOM简介总结