Head Rush Ajax

350

Chapter 6

Trees, trees, everywhere I look

You’ve already seen how the Document Object Model makes working

with HTML easy. But the DOM is a lot more versatile: you can use it

to work with XML documents as well. Let’s check out how the XML

returned from getUpdatedSales.php looks as a DOM tree:

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

totals

boards-sold

boots-sold

bindings-sold

“1710“

“315“

“85“

<?xml version=”1.0”

encoding=”utf-8”?>

<totals>

<boards-sold>1710</boards-sold>

<boots-sold>315</boots-sold>

<bindings-sold>85</bindings-sold>

</totals>

All the elements and text in

the XML document...

...show up in the DOM tree

representation of the XML.

Each of the three “sold”

elements has one child

node: a text node with the

number of that product

that’s been sold.

You may not have known...

≠

...that just as the browser sees your HTML as a DOM tree, web browsers

automatically convert any XML they have to deal with into DOM trees.

≠

...that you can work with more than one DOM tree in the same JavaScript

function. For example, you can read an XML DOM tree and update an

HTML DOM tree, all at the same time.

≠

...that HTML elements and XML elements are both just element nodes ...