`, ``). |
| **2** | `Attribute` | An attribute node (e.g., `category="cooking"`). *Note: In modern DOM specifications, attributes are generally accessed via element methods rather than as direct nodes.* |
| **3** | `Text` | The actual text content inside an element or attribute. |
| **4** | `CDATA Section` | A CDATA section node (e.g., ``). |
| **5** | `Entity Reference` | A reference to an entity (e.g., `&`). |
| **6** | `Entity` | An entity declaration. |
| **7** | `Processing Instruction` | An XML processing instruction (e.g., ``). |
| **8** | `Comment` | A comment node (e.g., ``). |
| **9** | `Document` | The root document node (the entire XML/HTML document). |
| **10** | `Document Type` | The Document Type Declaration (DTD) node (e.g., ``). |
| **11** | `Document Fragment` | A lightweight document object used to store segments of a document. |
| **12** | `Notation` | A notation declared in the DTD. |
---
## Code Examples
### Example 1: Retrieving the Node Type of an Element
The following code snippet loads an XML document (`books.xml`) using the helper function `loadXMLDoc()` and retrieves the node type of the first `` element:
```javascript
// Load the XML document
xmlDoc = loadXMLDoc("books.xml");
// Get the first element in the document
var x = xmlDoc.getElementsByTagName("title");
// Output the node type of the element
document.write("Node Type: " + x.nodeType);
```
#### Output:
```text
Node Type: 1
```
*(Since the selected node is an Element, the output is `1`.)*
---
### Example 2: Distinguishing Between Element and Text Nodes
In XML and HTML DOM, whitespace (such as line breaks and spaces) between elements is often treated as a `Text` node (Node Type `3`).
The following example demonstrates how to use `nodeType` to filter out empty text nodes and target only element nodes:
```javascript
// Load the XML document
xmlDoc = loadXMLDoc("books.xml");
// Get the child nodes of the first element
var childNodes = xmlDoc.getElementsByTagName("book").childNodes;
for (var i = 0; i < childNodes.length; i++) {
// Check if the node is an Element node (Type 1)
if (childNodes.nodeType === 1) {
document.write("Element Node Name: " + childNodes.nodeName + "
"); } else if (childNodes.nodeType === 3) { // This handles text nodes, including empty whitespace/newlines if (childNodes.nodeValue.trim() !== "") { document.write("Text Node Value: " + childNodes.nodeValue + "
"); } } } ``` --- ## Considerations 1. **Whitespace as Text Nodes**: Be aware that modern browsers parse whitespace (newlines, tabs, and spaces) between XML/HTML tags as text nodes (Node Type `3`). When traversing the DOM using properties like `firstChild`, `nextSibling`, or `childNodes`, always verify the `nodeType` to avoid unexpected errors. 2. **Read-Only**: The `nodeType` property is read-only. You cannot change a node's type by assigning a new value to this property. 3. **Named Constants**: In modern JavaScript environments, you can use named constants instead of numeric values for better code readability (e.g., `Node.ELEMENT_NODE` instead of `1`, or `Node.TEXT_NODE` instead of `3`).
"); } else if (childNodes.nodeType === 3) { // This handles text nodes, including empty whitespace/newlines if (childNodes.nodeValue.trim() !== "") { document.write("Text Node Value: " + childNodes.nodeValue + "
"); } } } ``` --- ## Considerations 1. **Whitespace as Text Nodes**: Be aware that modern browsers parse whitespace (newlines, tabs, and spaces) between XML/HTML tags as text nodes (Node Type `3`). When traversing the DOM using properties like `firstChild`, `nextSibling`, or `childNodes`, always verify the `nodeType` to avoid unexpected errors. 2. **Read-Only**: The `nodeType` property is read-only. You cannot change a node's type by assigning a new value to this property. 3. **Named Constants**: In modern JavaScript environments, you can use named constants instead of numeric values for better code readability (e.g., `Node.ELEMENT_NODE` instead of `1`, or `Node.TEXT_NODE` instead of `3`).
YouTip