认识
Node
Node 是一个接口,各种类型的 DOM API 对象会从这个接口继承。它允许我们使用相似的方式对待这些不同类型的对象;比如, 继承同一组方法,或者用同样的方式测试。
Node 有一个 nodeType 的属性表示 Node 的类型,是一个整数,不同的值代表不同的节点类型。具体如下表所示:
常量 | 值 | 描述 |
---|---|---|
Node.ELEMENT_NODE | 1 | 一个元素节点 |
Node.TEXT_NODE | 3 | Element 或者 Attr 中实际的文字 |
Node.PROCESSING_INSTRUCTION_NODE | 7 | 一个用于 XML 文档的 ProcessingInstruction |
Node.COMMENT_NODE | 8 | 一个 Comment 节点 |
Node.DOCUMENT_NODE | 9 | 一个 Document 节点 |
Node.DOCUMENT_TYPE_NODE | 10 | 描述文档类型的 DocumentType 节点 |
Node.DOCUMENT_FRAGMENT_NODE | 11 | 一个 DocumentFragment 节点 |
Node 常用类型
Element
Element提供了对元素标签名,子节点和特性的访问,我们常用HTML元素比如div,span,a等标签就是element中的一种。Element有下面几条特性:
- nodeType为1
- nodeName为元素标签名,tagName也是返回标签名
- nodeValue为null
- parentNode可能是Document或Element 子节点可能是Element,Text,Comment,Processing_Instruction,CDATASection或EntityReference
Text
Text表示文本节点,它包含的是纯文本内容,不能包含html代码,但可以包含转义后的html代码。Text有下面的特性:
- nodeType为3
- nodeName为#text
- nodeValue为文本内容
- parentNode是一个Element
- 没有子节点
Comment
Comment表示HTML文档中的注释,它有下面的几种特征:
- nodeType为8
- nodeName为#comment
- nodeValue为注释的内容
- parentNode可能是Document或Element
- 没有子节点
Document
Document表示文档,在浏览器中,document对象是HTMLDocument的一个实例,表示整个页面,它同时也是window对象的一个属性。Document有下面的特性:
- nodeType为9
- nodeName为#document
- nodeValue为null
- parentNode为null
- 子节点可能是一个DocumentType或Element
DocumentFragment
DocumentFragment是所有节点中唯一一个没有对应标记的类型,它表示一种轻量级的文档,可能当作一个临时的仓库用来保存可能会添加到文档中的节点。DocumentFragment有下面的特性:
- nodeType为11
- nodeName为#document-fragment
- nodeValue为null
- parentNode为null