Manipulating Documents using Methods

The Document Object Model provides a set of methods that you can use to create, delete, insert, exchange, and replace nodes with. When using the DOM's methods, you need to think in the terms we have introduced in the last three columns, i.e. document trees and document nodes. The table below shows the DOM's methods. For each method, it shows the syntax by which you may use the method, its argument type, its description, and the value it returns. The terms object and node are completely interchangeable in this table. Any reference to an object may be viewed as a reference to a document tree node, and vice versa. In the following pages we'll cover in depth each of the methods below.

The outcome of cloneNode(deep) and removeNode(deep) depends on the value of deep. When deep is true, the cloneNode method clones a complete subtree rooted at the specified node. When deep is false, just the specified node is duplicated, having no children at all. Similarly, when deep is true, the removeNode method removes a complete subtree rooted at the specified node. When deep is false, just the specified node is removed and all its children become children of their former father's father (former grandfather).

DOM's Method	Syntax	Argument Type	Effect	Returned Value
appendChild	fatherObj.appendChild(childObj)	An [object]	Appends an object (childObj) as a child to the specified object (fatherObj).	Appended [object]
applyElement	childObj.applyElement(fatherObj)	An [object]	Appends the object (childObj) as a child to an object (fatherObj).	Appended [object]
clearAttributes	clearedObj.clearAttributes()	NA	Removes all attributes (and their values) from the object (clearedObj)	Cleared [object]
cloneNode	newObj = originalObj.cloneNode(deep)	Boolean	Creates a new object (newObj), identical to the original object (originalObj) if deep is true. When deep is false only root will be cloned.	An [object]
createElement	newObj = document.createElement("htmlTag")	HTML Tag (ex: TR, IMG)	Creates a new tag node (newObj).	An [object]
createTextNode	newObj = document.createTextNode(string)	A String (ex: "this is the document body")	Creates a new text node (newObj).	An [object]
hasChildNodes	hasChildrenFlag = testedObj.hasChildNodes()	NA	Returns whether the object (testedObj) has children.	true for yes, false for no
insertBefore	parentObj.insertBefore(childObj, brotherObj)	An [object]	Inserts an object (childObj) as a child of the specified object (parentObj) just before the specified child (brotherObj).	true if successful, null if not
mergeAttributes	targetObj.mergeAttributes(sourceObj)	An [object]	Copies all attributes from the source object (sourceObj) to the target object (targetObj).	Target [object]
removeNode	deletedObj.removeNode(deep)	NA	Removes the deletedObj's subtree from the document hierarchy when deep is true. Removes just the node when deep is false.	Removed [object]
replaceNode	oldObj.replaceNode(newObj)	An [object]	Replaces an existing node (oldObj) with a new node (newObj).	Replaced [object]
swapNode	firstObj.swapNode(secondObj)	An [object]	Exchanges the positions of two nodes, firstObj and secondObj.	Swapped Out [object]