JavaScript——HTML DOM-元素の加入、削除、置換

————————————————————————————————————————————————————————————————————————————————————
一、新しい要素を作成する 
1.-apendChild()  まずこの要素を作成し、既存の要素に追加します.

This is a paragraph.
This is another paragraph.



var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var element=document.getElementById("div1");
element.appendChild(para)；</pre> 
   <pre style="border:1px dotted rgb(119,136,85);font-family:Consolas;background:rgb(245,245,245);line-height:1.4;font-size:14px;text-align:left;">

2.-insertBefore()

This is a paragraph.
This is another paragraph.



var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var element=document.getElementById("div1");
var child=document.getElementById("p1");
element.insertBefore(para,child);

————————————————————————————————————————————————————————————————————————————————————
二、既存のHTML要素を削除する

This is a paragraph.
This is another paragraph.


var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);

————————————————————————————————————————————————————————————————————————————————————
三、HTML要素を置換する
HTML DOMの要素を置換する場合は、replacceChild()の方法を使用してください.
実例

This is a paragraph.
This is another paragraph.



var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.replaceChild(para,child);