概要
指定ノードの子ノードを別のノードに置き換えます。
構文
replacedNode = parentNode.replaceChild(newChild, oldChild);
newChild:oldChildを置き換える新しいノード（既存のノードは先に取り除かれます）oldChild:newChildに置き換えるノードreplacedNode: 置き換えられたノード（oldChildが代入される）
例
// <div>
// <span id="childSpan">foo bar</span>
// </div>
// ID も属性も内容も持たない空要素を生成
var sp1 = document.createElement("span");
// 生成したノードに id 属性 'newSpan' を付与
sp1.setAttribute("id", "newSpan");
// テキストノードを生成
var sp1_content = document.createTextNode("新しい span 要素");
// 生成したテキストノードを先の空要素の子ノードとして配置
sp1.appendChild(sp1_content);
// 置換に先んじ、参照を代入
var sp2 = document.getElementById("childSpan"); // 既存の置換対象ノード
var parentDiv = sp2.parentNode; // 置換対象ノードの親要素
// 既存ノード "sp2" を 生成済の新しい span 要素 "sp1" と置換
parentDiv.replaceChild(sp1, sp2);
// 上記コード実行後のノードは以下の様になります:
// <div>
// <span id="newSpan">新しい span 要素</span>
// </div>