Chap 4

The chapter begins with the introduction of the Document Object Model (DOM). Web browsers use the DOM to represent a web page. When the DOM is changed with JavaScript code, the web page will change automatically.

* The "document" object gives your JavaScript access to the web browser's DOM tree.

Everything in the web browser's model of a web page can be accessed using the JavaScript "document" object.

The document object allows you to get the root element of the document (documentElement), find an element by "id" attribute (getElementById), create new markup nodes (createTextNode), and find nodes by their name (getElementsByTagName). p.205

The DOM works with Ajax, but isn't actually a part of Ajax.

With the DOM, you can move things around on a page, helping create nice CSS effects without reloading the page.

The book then goes on to discuss in depth the concept of the tree structure for a DOM with an HTML example. When a browser loads a page, it begins with html, so the html is called the root element. The "head" and "body" elements branch out from the root. Elements like "p" and "img" have nothing underneath, so they are the leaves. Page 232 shows the various ways of getting around the DOM tree with a node. Although, the node sometimes isn't supported by certain browsers.