想深入去学习 javascript ，有必要去知道一些关于 DOM 的知识。

一、那什么是 DOM 呢？？？

    DOM 定义了 html 和 xml 文档的标注：w3c 文档对象模型（DOM）是中立与平台和语言的接口，它允许程序或脚本动态的访问和修改文档的内容、结构和样式。

    w3c DOM 标准分为以下 3 个部分：

    （1）core DOM：针对于结构化文档的标准模型

    （2）xml DOM： 针对 xml 文档的标注模型

    （3）html DOM：针对 html 文档的标准模型

   接着我们可能会问，什么是 html DOM呢？？

    答：html DOM 定义了所有 html 元素的对象和属性， 以及访问它们的方法。

二、html DOM 树

    通过 HTML DOM，树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 元素（节点）均可被修改，也可以创建或删除节点。

    现在来理解一下几个基本概念，根节点，子节点、父节点、同胞节点。这些节点的理解其实理解二叉树的节点差不过。下面做一个基本介绍：

    父（parent）、子（child）和同胞（sibling）等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。

• 在节点树中，顶端节点被称为根（root）
• 每个节点都有父节点、除了根（它没有父节点）
• 一个节点可拥有任意数量的子
• 同胞是拥有相同父节点的节点

    下面的图片展示了节点树的一部分，以及节点之间的关系：

三、html DOM 的方法

    html DOM 常用方法总结如下：

    Demo：

    （1）getElementById（”id“）

    var x=document.getElementById("main");

    （2）getElementByTagName（”tagName”)

    var y=x.getElementsByTagName("a");

    （3）getElementByClassName（“className”）

    document.getElementsByClassName("group");

    注意：IE 9 及 以上才支持 getElementByClassName 的使用。在以前的版本里可自定义 getElementByClassName 方法。

    （4）另外谈一下一种对象集合访问方法，如下：

   1: <form id="form" action="">

   2:   name: <input type="text" name="name" value="admin"><br>

   3:   password: <input type="password" name="password" value="123456"><br>

   4:   <input type="submit" value="submit">

   5: </form> 

   6:  

   7:  

   8:

   9: <script>

  10: var x=document.getElementById("form");

  11: for (var i=0;i<x.length;i++)

  12:   {

  13:   document.write(x.elements[i].value);

  14:   document.write("<br>");

  15:   }

  16: </script>

四、html DOM 属性

    主要了解了解一下 html DOM 四个属性 innerHTML，nodeName，nodeValue，nodeType

    1、属性 innerHTML

    属性 innerHTML 用来获取元素节点的内容。如下：

   1: <div id="main">

   2:  

   3: <script>

   4:  document.getElementById("main").innerHTML = "hello  world";

   5: </script>