0
このセクションでは、まずデータを取得し、XMLファイルからデータを表示します。その後、submitという名前のボタンがあります。私が提出押すと、それが機能add()
を呼び出し、それがXMLファイルから最初のノードをコピーします。JavaScriptクローニングXMLノードの問題
<html>
<body>
<link rel="stylesheet" type="text/css" href="test.css" />
<table>
</tr class="top">
<td>ID</td>
<td>Orgin</td>
<td>Type</td>
<td>Color</td>
</tr>
<script type="text/javascript">
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","test.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
var x=xmlDoc.getElementsByTagName("product");
for (i=0;i<x.length;i++)
{
document.write("<tr class=a><td>");
document.write(x[i].getElementsByTagName("orgin")[0].getAttribute("id"));
document.write("</td><td>");
document.write(x[i].getElementsByTagName("orgin")[0].childNodes[0].nodeValue);
document.write("</td><td>");
document.write(x[i].getElementsByTagName("type")[0].childNodes[0].nodeValue);
document.write("</td><td>");
document.write(x[i].getElementsByTagName("color")[0].childNodes[0].nodeValue);
document.write("</td></tr>");
}
document.write("</table>");
function add()
{var id=document.getElementById('idProduct').value;
var time=document.getElementById('Time').value;
var org=document.getElementById('orgin').value;
var color=document.getElementById('color').value;
var type=document.getElementById('type').value;
xmlDoc=loadXMLDoc("test.xml"); //Problem happen here, the code doesn't functioning
oldNode=xmlDoc.getElementsByTagName('product')[1];
newNode=oldNode.cloneNode(true);
xml.Doc.documentElement.appendChild(newNode);
}
</script>
<br>
Inputs:
<br>
Time: <input type="text" id="time"><br>
ID: <input type="text" id="idProduct"><br>
Orgin: <input type="text" name="orgin"><br>
Type: <input type="text" name="type"><br>
Color: <input type="text" name="color"><br>
<input type="button" value="submit" onclick="add()"></input>
</body>
</html>
これはXMLファイルである:ここで
<?xml version="1.0" encoding="Big5" ?>
<set>
<product time="5">
<orgin id="1">sony</orgin>
<type>comp</type>
<color>red</color>
</product>
<product time="6">
<orgin id="2">apple</orgin>
<type>others</type>
<color>blue</color>
</product>
</set>
関数* loadXMLDoc *はどこに定義されていますか?関数を呼び出した時点で、* xmlDoc *はすでにXMLドキュメントです。さらにいくつかの行の下に、 'xml.Doc.documentElement'があります。おそらく' xmlDoc.documentElement'でなければなりません。 – RobG
また、テーブル全体をHTMLの1つの文字列として記述する必要があります。部分的にdocument.writingを書くことは非常に悪い考えです。各書き込みが完了すると、HTMLパーサーがそのビットをどのように作成しますか?とにかく、HTMLは無効に見えます。 – RobG
ありがとうございます。私はxml.Doc.documentElementを変更しました。そして、私はそれがloadXMLDocを定義するために何を意味するのかを知りたいですか? ここで指示に従っています: http://www.w3schools.com/dom/dom_nodes_clone.asp –