HTML DOM Nodes

« Previous Chapter Next Chapter »

In the DOM, everything in an HTML document is a node.

DOM Nodes

According to the DOM, everything in an HTML document is a node.

The DOM says:

  • The entire document is a document node
  • Every HTML element is an element node
  • The text in the HTML elements are text nodes
  • Every HTML attribute is an attribute node
  • Comments are comment nodes

DOM Example

Look at the following HTML document:

<html>
  <head>
    <title>DOM Tutorial</title>
  </head>
  <body>
    <h1>DOM Lesson one</h1>
    <p>Hai Everyone</p>
  </body>
</html>

The root node in the HTML above is <html>. All other nodes in the document are contained within <html>.

The <html> node has two child nodes; <head> and <body>.

The <head> node holds a <title> node. The <body> node holds a <h1> and <p> node.

Text is Always Stored in Text Nodes

A common error in DOM processing is to expect an element node to contain text.

However, the text of an element node is stored in a text node.

In this example: <title>DOM Tutorial</title>, the element node <title>, holds a text node with the value "DOM Tutorial".

"DOM Tutorial" is not the value of the <title> element

However, in the HTML DOM the value of the text node can be accessed by the innerHTML property.

You can read more about the innerHTML property in a later chapter.


« Previous Chapter Next Chapter »

Have Any Suggestion? We Are Waiting To Hear from YOU!

Your Query was successfully sent!