Scripting For The 6.0 Browsers
Revised January 27, 2002 | Printer-friendly version
Part 5: Summary
Whew. That's a lot of stuff to remember. The following tables summarize the difference DOM methods and properties we've covered.
Document Methods:
| getElementById(id) | Returns a reference to the named element. |
| getElementsByTagName(name) | Returns a collection of all matching elements in the document. |
| createElement(name) | Creates a new element of the type named. |
| createTextNode(text) | Creates a new node of pure text. |
Element Methods:
| getAttribute(id) | Returns the value of the named attribute. |
| setAttribute(id,value) | Assigns a new value to the attribute. |
| removeAttribute(id) | Removes the named attribute and its value. |
| getElementsByTagName(name) | Returns a collection of all matching elements in the node. |
Node Methods:
| appendChild(child) | Appends a new child node to the node. |
| removeChild(child) | Removes a child node from the node. |
| replaceChild(newChild,oldChild) | Replaces a child node with another one. |
| insertBefore(newChild,refChild) | Inserts a child node before another child node in the hierarchy. |
| hasChildNodes() | Returns a Boolean true if the node has children. |
Node Properties:
| nodeName | Contains the name of node as a string. |
| nodeType | Contains the type of the node as an integer. |
| nodeValue | Contains the value of the node in an applicable format. |
| parentNode | A reference to the parent node of this node. |
| childNodes | A collection containing references to all child nodes of this node. |
| firstChild | A reference to the first child node in the childNodes collection. |
| lastChild | A reference to the last child node in the childNodes collection. |
Conclusion
As you can probably see by now, the functionality of the WC3 DOM makes it possible to have extremely dynamic documents. If and when other browser manufacturers adopt this model, our lives as developers will be made a whole lot easier. We may be able to abandon our browser-sniffing scripts and be free to code truly cross-browser applications without all the headache. Maybe.
In the meantime, it behooves you (just what does that word mean, anyway?) to further educate yourself on the DOM and CSS specifications. We've covered most of the big stuff here, but there's plenty more the DOM provides. Spend some time at the W3C site and familiarize yourself with the specs and, you'll be ready to make it jump through hoops.
Happy scripting!
Learn More
- Comment on this tutorial.
- Find out more about Netscape 6 at developer.netscape.com
- Learn about DOM, CSS and standards support at www.w3c.org
- Join the cause at the Web Standards Project www.webstandards.org