The Document Object Model (DOM), Part 4: Manipulating Documents

The Document Object Model (DOM), Part 4: Manipulating Documents

In the last three columns we taught you all about the Document Object Model, supported by Internet Explorer 5.0 and up, and by Netscape's Gecko. This knowledge will be a good background for what you are about to learn in this and upcoming columns, which is how to manipulate documents using their DOM representations. The great advantage of the Document Object Model is that its methods apply to all document elements. As opposed to the Dynamic HTML Model which requires you to learn specific properties and methods for each of the tens of different document elements, the Document Object Model sports a score of properties and methods that are element-independent and affect all elements in the exact same way.

In this column we'll cover most of the methods you can use to manipulate documents using the Document Object Model. We'll show you which properties you can modify to affect a document's appearance. We'll tabulate all DOM's methods and demonstrate each one of them on a real live document. At the end of this column you will know how to use JavaScript to manipulate documents using the DOM, and you'll have a live example for each of its supported methods.

In particular, you'll learn:

• How to use properties to manipulate documents.
• How to use methods to manipulate documents.
• How to use the removeNode method.
• How to use the replaceNode method.
• How to use the swapNode method.