 Inside Technique : W3C DOM Table of Contents : DOM Properties and Methods
The W3C recommendation defines a number of methods for manipulating
the document as a hierarchy of nodes. A node can be either an HTML element or fragment of
text (there are other node types such as processing instructions, comments, etc, but they are not necessary for this example).
Below we list the properties and methods used in this article:
| document.createElement(sTagName) | Creates and returns an element
object for the specified tag name. |
| document.createTextNode(sData) | Creates and returns a TextNode
object with the specified contents. |
| document.getElementsByTagName(sTagName) | Locates and returns a collection with
all the specified elements in the document. A special wildcard value, "*", is defined
for returning all the elements in the document. This method is analogous to the
document.all.tags(sTagName) method defined by Internet Explorer and
the wildcard is the same as the Internet Explorer document.all collection. |
| element.childNodes() | Returns the collection of child nodes.
This collection is similar to the children collection defined in Internet Explorer. The primary
difference is the childNodes collection also contains TextNode objects. These are
objects that represent that actual content within each element. |
| node.insertBefore(node,nodePosition) |
The insertBefore method is used to insert nodes as children of the current element.
The nodePosition is the node to insert the the new node object before. This method
is often used to manipulate nodes created with the document's createElement and createTextNode
methods into the document.
|
| node.appendChild(node) |
A simplified version of insertBefore that automatically insert's the node as the last
child of an element. |
| node.nodeType | A read-only property that returns the type of
node. The two most common values are 1 for element objects and 3 for text nodes.
|
All of these methods are supported by Internet Explorer 5.0 and Netscape's Gecko
Developer's preview. These methods are a sampling of the object model defined by the
W3C recommendation and are the features we use to create a cross-browser standards-compliant
table of contents.
For the most part, these methods interoperate between the Internet Explorer 5.0 and Netscape Gecko.
One difference we will discuss later is Internet Explorer's incomplete support for getElementsByTagName().
IE5 is missing support for the wild card value. However, this is mostly a minor issue as we can
easiily work-around this by dynamically adding support to IE5 for this method.
Next we use these methods to visit and locate the header elements on the page.
© 1997-2000 InsideDHTML.com, LLC. All rights reserved.
| 