4.1. Need a dynamic application?
Here's the application you'll be building a little later in this chapter.
The DOM
lets you look at this web page
in this format.
4.1.1. Use the Document Object Model.
The web browser uses the D...
4.2. Meet the DOM
(again)
Although you may not have realized it, you've been using the DOM since way back in Chapter 1. Remember this code from Katie's Boards 'R' Us report?
function updatePage()
{
var newTotal = request.respon...
4.3. Under the Microscope: The document
object
Everything in the web browser's model of your web page can be accessed using the JavaScript "document" object. You've already seen the getElementById() function, but there's a lot more tha...
4.4. Using the DOM without Ajax
Since the Document Object Model isn't tied to your asynchronous programming, there's nothing preventing you from using the DOM in all your web applications. In fact, we're going to prove it to you
The Great Chap...
4.5. Here's the HTML that you give to the browser
When you're creating a web page, you write HTML to represent the different parts of your page. Then you give that HTML to the browser, and the browser figures out how to represent that HTML on t...
4.6. and here's how the browser sees the HTML
The browser has to make some sense of all that markup, and organize it in a way that allows the browserand your JavaScript codeto work with the page. Here's what the browser turns your text markup i...
4.7. Frequently Asked Questions?
Q:Do I need to reference the ajax.js file we've been using if I want to write JavaScript code that uses the DOM?A:Nope. In fact, Ajax and the Document Object Model have nothing to do with each other, other than ...
4.8. Frequently Asked Questions?
Q:The ordering of the elements and text in the HTML matters, right?A:Yes. So for the <html> element, the first child is <head>,
and the second is <body>
. If these were reversed, the tree wou...
4.9. Back to the forest
Remember, web browsers see your web pages as trees of elements, text, attributes, and other markup:
" trees are great for folks that
are far away."
"Our "
"depth-first" ...
4.10. 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 th...
4.11. A new type of tree: the DOM tree
Once the browser has your markup with the <html> element at the top, it creates a new object for each node in the tree. The result is a bunch of objects, all "connected" together, like you see ...
4.12. Podcasting Studio
HeadRush: We're here with the Document Object Model, talking about how web browsers really see HTML, and what JavaScript programmers need to know to update their pages on the fly. It's good to have you, ummm Docume...
4.13. Moving around in a DOM tree
You already know how the document object can help you find an element with a particular id attribute, but there are a lot of other ways you can get around in a DOM tree. Since each node has a parent, and mos...
4.14. Frequently Asked Questions?
Q:I understand text, and elements, and branches, but I'm still confused about exactly what a "node
" is.A:Everything in a DOM tree
is a node: elements, text, attributes, even comments. Since each piece ...
4.15. Some browsers don't recognize Node
Unfortunately, some web browsers don't support the Node class in your JavaScript. Your code won't run, and you're back to dealing with errors and null values.
if (someNode.nodeTypeAll browsers support th...
4.16. Frequently Asked Questions?
Q:So as long as my users aren't running Internet Explorer, I can use the Node object, right?A:Actually, you shouldn't ever use the Node object at least not until all major browsers support the Node object. Even...
С 2009 года мы стали переводить структура сайта на различные языки. Сайт теперь будет содержать книги не только на английском языке, но также и на других европейских языках, в том числе и на Русском языке.