关于 nodeType 、nodeName 、nodeValue
2019-02-17 本文已影响0人
风起云帆
nodeType 属性：
每个节点都有一个 nodeType 属性，用于表明节点的类型，节点类型由 Node 类型中定义12个常量表示。
| 常量名 | 常量值 | 节点类型 | 描述 |
|---|---|---|---|
| Node.ELEMENT_NODE | 1 | Element | 代表元素 |
| Node.ATTRIBUTE_NODE | 2 | Att | 代表属性 |
| Node.TEXT_NODE | 3 | Text | 代表元素或属性中的文本内容 |
| Node.CDATA_SECTION_NODE | 4 | CDATASection | 代表文档中的 CDATA 部（不会由解析器解析的文本） |
| Node.ENTITY_REFERENCE_NODE | 5 | EntityReference | 代表实体引用 |
| Node.ENTITY_NODE | 6 | Entity | 代表实体 |
| Node.PROCESSING_INSTRUCTION_NODE | 7 | ProcessingInstruction | 代表处理指令 |
| Node.COMMENT_NODE | 8 | Comment | 代表注释 |
| Node.DOCUMENT_NODE | 9 | Document | 代表整个文档（DOM 树的根节点） |
| Node.DOCUMENT_TYPE_NODE | 10 | DocumentType | 向为文档定义的实体提供接口 |
| Node.DOCUMENT_FRAGMENT_NODE | 11 | DocumentFragment | 代表轻量级的 Document 对象（文档的某个部分） |
| Node.NOTATION_NODE | 12 | Notation | 代表 DTD 中声明的符号 |
示例：
<body>
<div id="wrapper">hello world</div>
<script type="text/javascript">
var wrapper = document.getElementById("wrapper");
var node = document.getElementById("wrapper").getAttributeNode("id");
var text = document.getElementById("wrapper").firstChild;
console.log(wrapper.nodeType); //1
console.log(node.nodeType); //2
console.log(text.nodeType); //3
</script>
</body>
nodeName 属性 与 nodeValue 属性:
可以使用 nodeName 和 nodeValue 这两个属性。这两个属性的值完全取决于节点的类型。
一般来说：
- 元素节点的
nodeName是标签名称 - 属性节点的
nodeName是属性名称（大写） - 文本节点的
nodeName永远是#text - 文档节点的
nodeName永远是#document
继续上面的例子，打印出来：
1. console.log(document.nodeName) //#document
2. console.log(wrapper.nodeName); //DIV
3. console.log(node.nodeName); //id
4. console.log(text.nodeName); //#text
- 对于文本节点，
nodeValue属性包含文本。 - 对于属性节点，
nodeValue属性包含属性值。 - 文档节点和元素节点，
nodeValue属性的值始终为null。
console.log(document.nodeValue) //null
console.log(wrapper.nodeValue); //null
console.log(node.nodeValue); //wrapper
console.log(text.nodeValue); //hello world
