MetaChat REGISTER   ||   LOGIN   ||   IMAGES ARE OFF   ||   RECENT COMMENTS




artphoto by splunge
artphoto by TheophileEscargot
artphoto by Kronos_to_Earth
artphoto by ethylene

Home

About

Search

Archives

Mecha Wiki

Metachat Eye

Emcee

IRC Channels

IRC FAQ


 RSS


Comment Feed:

RSS

26 February 2009

Can someone help me understand what a DOM is and why it matters? I've read the wikipedia page. I've been using the web since the beginning. I've been designing for the web for several years now. I know some html. I know what CSS is and does. I know what Javascript is and does. What the fuck is DOM?[More:]I'm kind of stuck between:

1) very very simple explanations like "it's the high level structural plan for laying out an html/xml document" which is easy to understand but also facile and not illuminating in terms of why DOM matters and why it's been such a subject of debate

and

2) long rambling historical accounts of browser wars, etc

What the fuck is a DOM and why should I care? Can anyone help with a plain-english, bottom-line explanation?

THANK YOUS!
From my experience, DOM is really only interesting from a parsing perspective. That is, for an application trying to get at specific parts of the document. So, when I get an element I get all its attributes and children, for example.

I don't do much web dev but I honestly think it is useful for servers and others interested in parsing xml/html/xhtml.
posted by trinity8-director 27 February | 00:36
Here's a good practical answer: You know when you see javascript calls that have document.getElementByID in them? That's DOM. The javascript needs a standard way of reading and accessing an HTML document so it can do stuff to it. If web pages don't have standardized elements, then scripts don't work on those pages, because they don't know what to look for.

Like let's say you wrote a greasemonkey script that scans a thread here, looks for a comment by middleclasstool, and alters every comment afterward to say MIDDLECLASSTOOL FTW!!11!1!SEXHAY! The document object model is what allows that script to comb the page looking for what it needs to find.
posted by middleclasstool 27 February | 00:45
IANA web developer, but I think ...

application trying to get at specific parts of the document

The application is the javascript on a page. The document is the HTML or XML of the page. The parser is the browser. The javascript code runs on certain events occuring in the browser, reading and possibly modifying the document as held by the browser. This allows for dynamic behavior on the page, as in DHTML and AJAX.

The DOM is more general than this, but I think this is why a web developer would mostly care about it.
posted by DarkForest 27 February | 01:20
Okay, so it has to do with splitting up a document into its component parts, moving between those parts, selecting them, etc.

>>let's say you wrote a greasemonkey script that scans a thread here, looks for a comment by middleclasstool

In my very basic mind I'm just search for a string that equals "Posted by middleclasstool" and grabbing the stuff before it. How does a document model help me?

And how is this page's DOM related to other DOMs? Is there standardization between them? According to what rules? Or is every page's DOM different?
posted by scarabic 27 February | 01:32
This page looks pretty good.

just search for a string that equals "Posted by middleclasstool"

If it worked that way, the browser would have to reparse the html. By working with the internally held DOM, no reparsing is necessary.

I think the DOM for a page is specific for that page. The DOM is the structure for that particular page.
posted by DarkForest 27 February | 01:36
In my very basic mind I'm just search for a string that equals "Posted by middleclasstool" and grabbing the stuff before it. How does a document model help me?


You could do this by scanning the string of raw HTML, totally. But you'd have to write your own mini-parser that understands what the tags surrounding the attribution line look like, as opposed to the tags surrounding the comment itself. It would also have to deal with edge cases, such as someone writing "Posted by middleclasstool" in the middle of their own comment.

On the other hand, if the HTML document were reasonably well marked-up, with, say, a div of class 'comment' around the comment text, followed by a p of class 'attribution', you could fairly easily write some code that uses the DOM to say "give me an array of all the p's with class 'attribution', then for each one step back one element to a div of class 'comment', and give me the inner text of that element". It's less code for you to write, and less error-prone.

But screen-scraping isn't usually what you use the DOM for. Think of things like posting comments via AJAX, rather than reloading the page. The DOM is what gives you the hooks to create a new page element, insert the new content into it, and then make it fade in on the page or whatever. Without the DOM, there would be no way to programatically access the elements on the page like that and tell them to do stuff.

And how is this page's DOM related to other DOMs? Is there standardization between them?


Think of a game of chess that's been written down in a newspaper or a book. There's a standard method of notating a game of chess, which any chess lover can understand, but each particular game of chess is different. In a similar way, most browsers create a set of objects in a standard way to represent a particular HTML document, but which objects they create, what properties they have, and what order they're in will be different for each different HTML document.

(Like everything browser-related, there are of course slight differences of detail in the DOM one browser constructs, and the DOM another browser constructs, for a given document. Current-era, browsers, though, agree on pretty much all of the main objects and methods, so you can write JavaScript that'll work on all of them.)
posted by chrismear 27 February | 04:56
the important part of DOM is the second two letters "object model". The DOM describes a website as a collection of objects. Some of the object can contain other objects.

If you want to get to a specific part of a website using the javascript, you can. Because of the DOM.

So you can say stuff like ...
Give me the contents of document.leftsidebar.pagedescption.postcount.value
Set those contents to a value I've just got from the server.

This allows you to dynamically change your website using javascript, and it's because of this we have such groovy interactove features with web 2.0
posted by seanyboy 27 February | 14:13
First World Woes || Okay.... Facebook. Should I make my husband a page?

HOME  ||   REGISTER  ||   LOGIN