YouTip

## XML DOM: Document lastChild Property The `lastChild` property of the `Document` object returns the last child node of the document. In an XML document, this is typically the root element of the document (unless there are comments or processing instructions following the root element). --- ## Syntax ```javascript documentObject.lastChild ``` ### Return Value * **Node Object**: Returns the last child node of the document. If the document has no child nodes, it returns `null`. --- ## Browser Differences and Whitespace Nodes When working with the DOM, it is crucial to understand how different browsers handle whitespace and line breaks: * **Modern Browsers (Firefox, Chrome, Safari, Edge, etc.)**: These browsers treat empty spaces, tabs, and line breaks between elements as **text nodes** (node type 3). * **Legacy Internet Explorer (IE 8 and earlier)**: These versions ignore empty whitespace text nodes between elements. Because of this difference, if your XML document has a trailing line break or comment at the end, `document.lastChild` might return a text node or comment node instead of the actual root element. ### Solution: Filtering for Element Nodes To ensure you get the last **element node** (node type 1) across all browsers, you can use a helper function that traverses backward using `previousSibling` until it finds a node with a `nodeType` of `1`. --- ## Code Example The following example loads an XML file named `books.xml` into `xmlDoc` and retrieves the last child node of the document. ### The XML File (`books.xml`) ```xml Giada De Laurentiis 2005 30.00 ``` ### JavaScript Implementation ```javascript // Helper function to get the last element child node function get_lastchild(node) { var x = node.lastChild; // Loop backward until we find an element node (nodeType 1) while (x && x.nodeType !== 1) { x = x.previousSibling; } return x; } // Load the XML document var xmlDoc = loadXMLDoc("books.xml"); // Retrieve the last element child of the document var lastElementNode = get_lastchild(xmlDoc); // Output the node name and node type document.write("Node Name: " + lastElementNode.nodeName); document.write(" (Node Type: " + lastElementNode.nodeType + ")
"); ``` ### Output ```text Node Name: bookstore (Node Type: 1) ``` --- ## Related Topics * **(dom-document-firstchild.html)**: Retrieves the first child node of the document. * **[Node.nodeType Property](dom-node-nodetype.html)**: Learn more about different DOM node types (e.g., Element, Text, Comment).