YouTip

## XML DOM: previousSibling Property The `previousSibling` property returns the node immediately preceding the specified node in the same tree level (as siblings). If there is no such node, this property returns `null`. --- ## Syntax ```javascript nodeObject.previousSibling ``` ### Return Value * **Node Object**: Represents the node immediately preceding the current node. * **null**: Returned if the current node is the first child of its parent. --- ## Key Considerations: Whitespace vs. Element Nodes When working with the DOM, it is crucial to understand how different environments and browsers handle whitespace (such as spaces, tabs, and line breaks) between elements. * **Whitespace as Text Nodes**: Most modern browsers (including Chrome, Firefox, Safari, and Edge) treat the whitespace or line breaks between HTML/XML tags as empty **Text Nodes**. Therefore, calling `previousSibling` on an element might return a `#text` node instead of the preceding element node. * **Element Nodes**: An Element Node has a `nodeType` value of `1`. To bypass whitespace and retrieve only the preceding **Element Node**, you can either: 1. Use a custom loop to filter out non-element nodes (as shown in the example below). 2. Use the modern **`previousElementSibling`** property, which automatically ignores text and comment nodes and returns only the preceding element. --- ## Code Example The following example loads an XML document named `books.xml` and retrieves the sibling node immediately preceding the first `` element. To ensure cross-browser compatibility and avoid getting empty text nodes, we use a helper function `get_previoussibling()` to find the actual preceding element node (where `nodeType` is `1`). ### JavaScript Implementation ```javascript // Helper function to get the previous sibling that is an Element Node (nodeType === 1) function get_previoussibling(n) { let x = n.previousSibling; while (x && x.nodeType !== 1) { x = x.previousSibling; } return x; } // Load the XML document const xmlDoc = loadXMLDoc("books.xml"); // Select the first element const authorNode = xmlDoc.getElementsByTagName("author"); document.write(authorNode.nodeName + " = " + authorNode.childNodes.nodeValue); // Get the previous sibling element const previousElement = get_previoussibling(authorNode); document.write("
Previous sibling: "); if (previousElement) { document.write(previousElement.nodeName + " = " + previousElement.childNodes.nodeValue); } else { document.write("None"); } ``` ### Expected Output ```text author = Giada De Laurentiis Previous sibling: title = Everyday Italian ``` --- ## Related Properties * **`nextSibling`**: Returns the node immediately following the specified node at the same tree level. * **`previousElementSibling`**: Returns the preceding element node, ignoring any intervening whitespace or text nodes.