要素ノードを追加するには、まずcreateElement()メソッドでXML文書(Documentオブジェクト)に要素ノードを作成し、それをappendChild()メソッドで指定したノードの子ノードとして追加する。
■createElement()メソッド
・Elementオブジェクトのメソッド。XML文書(Documentオブジェクト)にElementノード(要素)を生成する
・(書式) 戻り値 = Documentオブジェクト.createElement(生成するElement名)
・戻り値･･･生成されたElementノード
■appendChild()メソッド
・Nodeオブジェクトのメソッド。子ノードの最後にNodeオブジェクトを追加する
・(書式) 戻り値 = Nodeオブジェクト.appendChild(追加するNodeオブジェクト)
・戻り値･･･追加されたNodeオブジェクト。追加に失敗した場合nullが返される。
■removeChild()メソッド
・Nodeオブジェクトのメソッド。子ノードを削除する
・(書式) 戻り値 = Nodeオブジェクト.removeChild(削除するNodeオブジェクト)
・戻り値･･･削除されたNodeオブジェクト。削除に失敗した場合nullが返される。
[サンプルXML文書を表示](下のフレームに)
XMLソース
<?xml version="1.0" encoding="Shift_JIS" ?>
<家系>
<親>お父さんお母さん
<姉>お姉さん</姉>
<私>
<長男>上のむすこ<孫1>長男の娘<曾孫>長男の娘の子</曾孫></孫1></長男>
<長女>むすめ<孫2>長女の息子</孫2></長女>
<次男>下のむすこ</次男>
</私>
<弟>おとうと</弟>
</親>
</家系>
HTMLソース
<SCRIPT language="JavaScript"><!--
//元の内容を表示 function test1(){
var xmlobj=new ActiveXObject("MSXML2.DOMDocument");
xmlobj.async=false;
xmlobj.load("element01.xml");
var objChilds = xmlobj.selectSingleNode("//私").childNodes;
var str = "私の子供は";
for(i=0;i<objChilds.length;i++){
str += "<br> " + objChilds(i).xml;
}
dv.innerHTML = str;
}
//要素ノードの追加・削除した結果を表示 function test2(){
var xmlobj=new ActiveXObject("MSXML2.DOMDocument");
xmlobj.async=false;
xmlobj.load("element01.xml"); var objWatasi = xmlobj.selectSingleNode("//私");
var newElement1 = xmlobj.createElement("三男");
var newText1 = xmlobj.createTextNode("三番目のむすこ");
newElement1.appendChild(newText1);
objWatasi.appendChild(newElement1);
var newElement2 = xmlobj.createElement("孫2");
var newText2 = xmlobj.createTextNode("三男の娘");
newElement2.appendChild(newText2);
newElement1.appendChild(newElement2);
var objChilds = objWatasi.childNodes;
objWatasi.removeChild(objChilds(1));//2番目の子ノードを削除
var str = "私の子供は";
for(i=0;i<objChilds.length;i++){
str += "<br> " + objChilds(i).xml;
}
dv.innerHTML = str;
}
//--></SCRIPT>
</HEAD>
<BODY>
<BUTTON onclick="test1()">元の内容</BUTTON><BR><BR>
<BUTTON onclick="test2()">要素ノードの追加と削除</BUTTON><BR><BR>
<DIV id="dv" style="margin-left:20px;border:1px solid green"> </DIV>
end(05/5/6)