HTML and CSS Reference
In-Depth Information
The following code example shows a <div> element that contains an unordered list, which in turn contains a num-
ber of list items.
<div>
<ul id="fruits">
<li>Apples</li>
<li>Oranges</li>
<li>Bananas</li>
</ul>
</div>
When the DOM is generated, it first creates an element node for the <div> element. As the unordered list is nested
within this element, it would become a child node of the <div> element node. This <ul> element also has an id
attribute. This would become a property of the unordered list node. Each list item then becomes a child node of the
unordered list node. Figure 10-1 shows how this segment of the DOM tree would be visualized (not including prop-
erties).
Figure 10-1 A visual representation of a segment from the DOM tree.
As you can see in this diagram, there is more than one type of node. The main two types that you will need to worry
about are element nodes and text nodes. As the names suggest, element nodes are created for HTML elements and
text nodes are created for the text contained within HTML elements.
Search WWH ::




Custom Search