Accessing Element Content

To implement useful functionality, it is not enough to navigate to a document tree node. You often need to query the content of a specific node, or a set of nodes.

Three simple ways to access node content

The DOM provides three simple ways to access node content.

Method 1

The first and most obvious way is to use the HTML element and attribute navigation methods to access child elements and attributes. Sooner or later you reach a node that does not have any child.

Method 2

The second way is to use the textContent property of the node you have grasped. It retrieves the concatenated text within the element, excluding all other nodes.

Method 3

The third and most frequently used way is to obtain the value of the innerHTML property, which retrieves the textual representation of the HTML markup embedded within the element.

Listing 6-5 demonstrates using the textContent and innerHTML properties.

Listing 6-5: Using the textContent and innerHTML properties.