javascript置換既存元素replacceChild()使用紹介


replacceChild(a,b)は、ドキュメント内の既存の要素を置き換えるためのパラメータa:挿入するノード、パラメータb:置換するノード
 
var oDiv = document.getElementById("guoDiv");
var oSpan = document.createElement("span");
oSpan.innerHTML = "4";
var firsChild = oDiv.firstElementChild ? oDiv.firstElementChild : oDiv.firstChild
var returnNode = oDiv.replaceChild(oSpan, firsChild); // ,
alert(returnNode.innerHTML); //1
var lastChild = oDiv.lastElementChild ? oDiv.lastElementChild : oDiv.lastChild;
oSpan = document.createElement("span");
oSpan.innerHTML = "5";
returnNode = oDiv.replaceChild(oSpan, lastChild); // ,
alert(returnNode.innerHTML);//3
 
<div id="guoDiv">
<span>1</span>
<span>2</span>
<span>3</span>
</div>