DOM:element.replaceChild

From MDC

« Gecko DOM Reference

Contents 1 Summary 2 Syntax 3 Example 4 Specification

[edit] Summary

Replaces one child node of the specified element with another.

[edit] Syntax

replacedNode = parentNode.replaceChild(newChild, oldChild);

• newChild is the new node to replace oldChild. If it already exists in the DOM, it is first removed.
• oldChild is the existing child to be replaced.
• replacedNode is the replaced node. This is the same node as oldChild.

[edit] Example

// <div>
//  <span id="childSpan">foo bar</span>
// </div>

// create an empty element node
// without an ID, any attributes, or any content
var sp1 = document.createElement("span");

// give it an id attribute called 'newSpan'
sp1.setAttribute("id", "newSpan");

// create some content for the new element.
var sp1_content = document.createTextNode("new replacement span element.");

// apply that content to the new element
sp1.appendChild(sp1_content);

// build a reference to the existing node to be replaced
var sp2 = document.getElementById("childSpan");
var parentDiv = sp2.parentNode;

// replace existing node sp2 with the new span element sp1
parentDiv.replaceChild(sp1, sp2);

[edit] Specification

DOM Level 1 Core: replaceChild

DOM Level 2 Core: replaceChild