Javascript高级程序设计读书笔记（第10章 DOM）

第10章 DOM

10.1  节点层次

　　 每个节点都有一个nodeType属性，用于表明节点的类型。任何节点类型必是下面中的一个：

• • Node.Element_NODE(1);
  • NODE.ATTRIBUTE_NODE(2);
  • Node.TEXT_NODE(3);
  • Node.CDATA_SECTION_NODE(4);
  • Node.ENTITY_REFERENCE_NODE(5);
  • Node.ENTITY_NODE(6);
  • Node.PROCESSING_INSTRUCTION_NODE(7);
  • Node.COMMENT_NODE(8);
  • Node_DOCUMENT_NODE(9);
  • Node.Document_TYPE_NODE(10);
  • Node.DOCUMENT_FRAGMENT_NODE(11);
  • Node.NOTATION_NODE(12);

　　每个节点都有childNoes属性，保存着一个NodeList对象。NodeList是一种类数组对象，用于保存一个组有序的节点。

　　每个节点都有一个parentNode属性，该属性指向文档树中的父节点。

　　childNodes中的每个节点之间都是同胞节点。通过使用previousSibling和nextSibling属性可以访问。列表中的第一个节点的previousSibling和最后一个节点的nextSibling都为null。

　　父节点的firstChild和lastChild属性分别指向childNodes中的第一个和最后一个节点。

　　owneDocument表示整个文档的文档节点。

　　appendChild用于向childNodes列表的末尾添加一个节点，并返回新增的节点。

　　insertBefore()方法接受两个参数：要插入的节点和作为参照的节点。如果参照点是null，则insertBefore()和appendChild()执行相同的操作。返回新插入的节点。

　　replaceChild()方法接受两个参数：要插入的节点和要替换的节点，返回要替换的节点。

　　removeChild()移除节点，接受一个参数：要移除的节点。返回被移除的节点。

　　cloneNode()用户创建调用这个方法的节点的一个完全相同的副本。该方法接受一个布尔值参数，如果为true表示执行深复制，表示复制节点机器整个子节点树。没有父节点，相当于一个孤儿

　　document节点具有下列特征：

• nodeType的值为9
• nodeName的值为“#document”
• nodeValue的值为null
• parentNode的值为null
• ownerDocument的值为null

　　document.documentElemenet即为HTML元素

　　document.body即为body元素

　　getElementById()  getElementByTagName();

　　Text类型的节点具有以下特征：

• nodeType的值为3
• nodeName的值为“#text”
• nodeValue的值为节点所包含的文本
• parentNode是一个element
• 没有子节点，不支持

　　Comment类型

　　　　Comment节点具有下列特征：

• nodeType的值为8
• nodeName的值为“#comment”
• nodeValue的值是注释的内容；
• parentNode可能是Document或Element
• 不支持子节点

　　　　可以使用document.createComment()并为其传递注释文本也可以创建注释节点。