replaceChild (W3C DOM Core method)

Spec
Version Depr. Static
DOM1 No No
Browser support (more…)
IE5.5+ FF1.5+ SA1.3+ OP9+
Full Full Full Full
Returns
Node
Throws
HIERARCHY_REQUEST_ERR, WRONG_DOCUMENT_ERR, NO_MODIFICATION_ALLOWED_ERR, NOT_FOUND_ERR

Example

node.replaceChild(newchild, existingchild);

The example above will replace existingchild with newchild among the children of node.

So in the following HTML example, let's say that node is the first dd element and existingchild is the text node inside it:

<dl>
  <dt>Captain Kathryn Janeway</dt>
  <dd>Genevieve Bujold</dd>
</dl>

Then if newchild is a text node with the value Kate Mulgrew, the replace operation would result in this:

<dl>
  <dt>Captain Kathryn Janeway</dt>
  <dd>Kate Mulgrew</dd>
</dl>

So you can see that replaceChild is effectively the same as removeChild followed by appendChild, in a single operation.

Arguments

new child (Node) required

The node to be added.

existing child (Node) required

The node to be removed and replaced.

Description

Replace an existing child of this node with a new child node. If the new child is already present in the DOM tree it is first removed (effectively moving it).

Return value

The node that was removed

Compatibility

Internet Explorer Firefox Safari Opera
5.5 6.0 7.0 1.5 2.0 3.0 1.3 2.0 3.0 9.0 9.5
Full Full Full Full Full Full Full Full Full Full Full

No known issues.

User-contributed notes

There are no comments yet.

Related Products