Head First Ajax

Chapter 6. The Document Object Model: Web Page Forestry

Wanted: easy-to-update web pages. It’s time to take things into your own hands and start writing code that updates your web pages on the fly. Using the Document Object Model, your pages can take on new life, responding to users’ actions, and you can ditch unnecessary page reloads forever. By the time you’ve finished this chapter, you’ll be able to find, move, and update content virtually anywhere on your web page. So turn the page, and let’s take a stroll through the Webville Tree Farm.

You can change the CONTENT of a page...

So far, most of the apps we’ve built have sent requests, gotten a response, and then used that response to update part of a page’s content.

... or you can change the STRUCTURE of a page

But what if you need to do more than just change the content of a <div> or replace the label on a button? What if an image needs to actually move on a page? How would you accomplish that?

Your users can’t change your XHTML.

The structure of your page is defined in your XHTML, and people viewing your pages definitely can’t mess around with that structure. Otherwise, all the work you’d put into your pages would be a total waste of time. ...