A good way to visualize the HTML DOM is through an inverted tree of elements, attributes, texts and other node types. At the root we have the document itself, which then branches off to the head and body elements.
Each part of this tree can be considered as an object. These objects contain methods that update, add, and change its various properties. Thus, we may think of the DOM as an Application Programming Interface (API) to our webpage.
As you can see from the tree above, nodes make up our tree. There are four main types of nodes - document, element, attribute and text nodes.
The document node is the root, and is the starting point of all elements. All other nodes start at the document node.
Element nodes are the HTML tags that act as the backbone to the page. When viewing a page's HTML source, this includes all HTML tags embedded within brackets (
HTML elements can have attributes. For example, in the
<a href="http://google.com">Google</a> element, the attribute is the
href value. Other common attributes include
id, which can be changed to trigger new rules.
One important aspect of attribute nodes is that they are not children of the elements that contain them. If you look back at the diagram, notice that the attribute nodes are on the side of their elements, not below.
Text nodes are children of elements that contain text. Text nodes do not include other elements, so if there exists an element within another, it becomes a child of the parent element.
Here are a list of document properties. In order to call these, use the dot notation with the document object (eg.
Relieve your stress, back, neck and sciatic pain through 1,782 acupuncture points for immediate neck pain relief. Made for lower, upper and mid chronic back pain treatment, and improves circulation, sleep, digestion and quality of life.$$ Check price