DOM10-1节点层次

DOM（问的那个对象模型）是针对HTML和XML文档的API。DOM描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的一部分。

每个节点都拥有各自的特点、数据和方法，另外和其他节点也存在某种关系。

文档元素是文档的最外层元素，文档中的所有元素都包含在文档元素中，每个文档只有一个文档元素。

在HTML中文档元素始终是<html>

在XML中没有预定义的元素，因此任何元素都可能成为文档元素

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Document</title>
 </head>
 <body>
    <p>内容</p>
 </body>
</html>

NODE 类型

Dom定义了一个接口，该接口将由DOM中的所有节点类型实现

每个节点都有一个nodeType属性

12个类型用12个数值常量来表示

    const unsigned short      ELEMENT_NODE                   = 1;   元素节点
    const unsigned short      ATTRIBUTE_NODE                 = 2;   属性节点
    const unsigned short      TEXT_NODE                      = 3;   文本节点
    const unsigned short      CDATA_SECTION_NODE             = 4;   CDATA 区段
    const unsigned short      ENTITY_REFERENCE_NODE          = 5;   实体引用元素
    const unsigned short      ENTITY_NODE                    = 6;   实体
    const unsigned short      PROCESSING_INSTRUCTION_NODE    = 7;   表示处理指令
    const unsigned short      COMMENT_NODE                   = 8;   注释节点
    const unsigned short      DOCUMENT_NODE                  = 9;   最外层的Root element,包括所有其它节点
    const unsigned short      DOCUMENT_TYPE_NODE             = 10;   <!DOCTYPE………..>
    const unsigned short      DOCUMENT_FRAGMENT_NODE         = 11;   文档碎片节点
    const unsigned short      NOTATION_NODE                  = 12;   DTD 中声明的符号节点

所以调用每一个节点的nodeType可以返回相应的节点的属性值

通过比较可以知道节点的类型

if (someNode.nodeType == Node.ElEMENT_NODE)
        {
            console.log('Node is an element');
        }

但是IE没有公开Node类型的构造函数，所以上一种方法不支持IE

所以通用的做法是

if (someNode.nodeType == 1)
        {
            console.log('Node is an element');
        }

1、nodeName和nodeValue属性

在使用这两个值之前先检测一下节点的类型

if (someNode.nodeType == 1)
        {
            var value = someNode.nodeName;
        }

如果是元素节点，就保存nodeName的值，nodeName中始终保存着元素的标签名，nodeValue中为null

    const unsigned short      ELEMENT_NODE                   = 1;   元素节点
    const unsigned short      ATTRIBUTE_NODE                 = 2;   属性节点
    const unsigned short      TEXT_NODE                      = 3;   文本节点
    const unsigned short      CDATA_SECTION_NODE             = 4;   CDATA 区段
    const unsigned short      ENTITY_REFERENCE_NODE          = 5;   实体引用元素
    const unsigned short      ENTITY_NODE                    = 6;   实体
    const unsigned short      PROCESSING_INSTRUCTION_NODE    = 7;   表示处理指令
    const unsigned short      COMMENT_NODE                   = 8;   注释节点
    const unsigned short      DOCUMENT_NODE                  = 9;   最外层的Root element,包括所有其它节点
    const unsigned short      DOCUMENT_TYPE_NODE             = 10;   <!DOCTYPE………..>
    const unsigned short      DOCUMENT_FRAGMENT_NODE         = 11;   文档碎片节点
    const unsigned short      NOTATION_NODE                  = 12;   DTD 中声明的符号节点