you’re on your way �
225
the document object model
Browsers see the world upside down
Of course, browsers don’t literally store a picture of a tree with your markup on
it. If you want to really understand what the browser stores in memory, you need
to learn about the DOM. Let’s see how the browser takes the tree you just looked
at and represents it with objects.
First, the browser ips the entire tree upside down so the <html> element is at
the top of the tree instead of the bottom:
html
“Below are our ne
binary tree options:”
p
p
“Binary Tree Selection”
title
“You can view other
products in the “
“Main Menu”
a
“.”
“depth-rst”
“breadth-rst”
“ trees are great for folks
that are far away.”
em
em
“ trees are a favorite for
nearby neighbors.”
“Our “
“Our “
div
div
head
body
When you’re working with the DOM,
the “top” of the tree is the root
element. In a web page, that’s <html>.
With this “top-down” view
of the HTML, you can see
a node’s parent element,
and any child nodes, easily.
parent
child
Here’s the text in the second
<div>, broken up into several text
nodes to keep the emphasized
word in the right place.
Even though we
ipped the tree over,
we still move from
left-to-right when
we order nodes.