Extracting information about objects

Various properties and methods can be used to obtain information about nodes. Some of these properties and methods are applicable only to certain types of nodes.

Property innerHTML

The value of this property is a string containing the entire HTML content of an element. In this example:

<body>
  <p>One</p>
  <p>Two</p>
</body>

the value of document.body.innerHTML is a string with all the text between the start tag and end tag of the body element, including the tags for the paragraph elements and the line breaks.

Property textContent

The value of this property is a string formed by the concatenation of just the text (no HTML element names included) of all the descendants of the node. In the example above, for either of the paragraph nodes, the values of textContent and innerHTML will be identical. In contrast, unlike the value of document.body.innerHTML, the value of document.body.textContent will not contain the tags for the paragraph elements.

Property style

The property style gives the style of a node, and a particular attribute can be specified by using dot notation a second time. For example, suppose a paragraph element has been assigned to the variable item. Then the font size can be extracted using item.style.fontSize.

Notice that the name of an attribute in CSS that has a hyphen, such as font-size, is written instead with the hyphen removed and the next letter capitalized, as in fontSize.

Method .getAttribute(attribute)

The method getAttribute can be used to determine the value of a particular attribute, such as style, class, or id. Again assuming that a paragraph element has been assigned to the variable item, its ID can be extracted using item.getAttribute("id").