If you'd like to have some practical examples of what you can do with the W3C DOM, read my book ppk on JavaScript, especially chapter 8.
My W3C DOM Compatibility Tables are by far the most popular resource on this site. Here you find an overview of W3C DOM compatibility, as well as links to the individual tables.
| Selector | IE 5.5 | IE 6 | IE 7 | IE8b1 | FF 2 | FF 3b4 | Saf 3.0 Win | Saf 3.1 Win | Opera 9.5b | Konqueror 3.5.7 |
|---|---|---|---|---|---|---|---|---|---|---|
| Node manipulation | Yes | Yes | Yes | Yes | Yes | |||||
|
The W3C DOM Core module defines how to access, read and manipulate an XML document. Well-formed HTML documents are XML documents, so these methods and properties can be used to completely rewrite any HTML page, if you so wish. Here you find details on how to find elements, how to create new ones, how to read out node information and how to change the structure of the document. |
||||||||||
| HTML tag manipulation | Yes | Almost | Yes | Yes | Yes | Yes | ||||
|
Though HTML documents are XML documents, they have a number of special features that the average XML document doesn't have. The W3C DOM HTML module defines these special cases and how to deal with them. Here you find details on getting and setting properties of HTML elements, such as |
||||||||||
| Stylesheet manipulation | Yes | Yes | Yes | Yes | Yes | |||||
|
Style sheets are part of the document, too (sort of). The W3C DOM CSS module gives access to style sheets and some browsers even allow you to change a style sheet. Where traditional DHTML changes only the styles of specially selected elements, these new methods allow you to change the styles of an entire page. Two lines of code suffice to make all paragraphs on your page red instead of black, for instance. This module contains some browser incompatibilities, but they are of the cute kind. W3C and Microsoft define some different methods and arrays, but some simple object detection allows you to evade these problems. |
||||||||||
| Yes | Yes | Yes | Yes | Yes | ||||||
|
Event support in all browsers. |
||||||||||
| Event manipulation | To be retested | |||||||||
|
The W3C DOM Events module specifies how events are being handled. The MS DOM events module does the same, but in a different way. These tables detail both Event modules and also Netscape 4's old system. See the Introduction to events and subsequent pages for more information. |
||||||||||
| Element dimensions, mouse coordinates, and miscellaneous | Almost | Yes | Yes | Yes | Yes | |||||
|
This specification contains several age-old properties that all browser support but that never have made it to a W3C specification yet. |
||||||||||
| Range objects | Microsoft model | ? | Yes | Yes | ? | Yes | ? | |||
|
Range objects are created when the user selects text. It's also possible to create your own range. Unfortunately the Microsoft model is distinctly worse than, as well as completely different from, the W3C model. |
||||||||||
| Selector | IE 5.5 | IE 6 | IE 7 | IE8b1 | FF 2 | FF 3b4 | Saf 3.0 Win | Saf 3.1 Win | Opera 9.5b | Konqueror 3.5.7 |