DOM properties and one method

Since the DOM consists of different types of objects, which properties apply to a particular object depend on the type of object it is.

Properties of the document node

The document node plays a special role, as the root of the tree. There are several properties specific to the document node, as listed below.

Name	Meaning
documentElement	the html element
head	the head element
body	the body element

Properties of all nodes

The objects for all nodes have the following properties: nodeType, nodeName, and nodeValue.

As we will look at only some of the types of nodes in detail, only some of the values of the properties are listed below.

Node type	nodeType	nodeName	nodeValue
element node	1	tag name in upper case	null
attribute node	2	attribute name	attribute value
text node	3	the string "#text"	text content

Using the DOM

Since repeatedly accessing the DOM can be very time-consuming, it is advisable to extract information once and store it in a variable for further processing to reduce the number of accesses.

In using the canvas we introduced the method .getElementById(), which returns the element with the ID equal to the input string. Be careful to use an upper-case I and a lower-case d - making them both upper-case is an easy mistake to make.

Using the method we introduced, we would use the following steps to store object with the ID special in a variable and then to access the variable rather than repeatedly access the tree:

var specialNode = document.getElementById("special");
console.log(specialNode.nodeType);
console.log(specialNode.nodeName);
console.log(specialNode.nodeValue);