2011-07-18 9 views
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> 
+0

関数* loadXMLDoc *はどこに定義されていますか?関数を呼び出した時点で、* xmlDoc *はすでにXMLドキュメントです。さらにいくつかの行の下に、 'xml.Doc.documentElement'があります。おそらく' xmlDoc.documentElement'でなければなりません。 – RobG

+0

また、テーブル全体をHTMLの1つの文字列として記述する必要があります。部分的にdocument.writingを書くことは非常に悪い考えです。各書き込みが完了すると、HTMLパーサーがそのビットをどのように作成しますか?とにかく、HTMLは無効に見えます。 – RobG

+0

ありがとうございます。私はxml.Doc.documentElementを変更しました。そして、私はそれがloadXMLDocを定義するために何を意味するのかを知りたいですか? ここで指示に従っています: http://www.w3schools.com/dom/dom_nodes_clone.asp –

答えて

0

は、W3Schoolsのloadxmldoc.jsファイルです:

function loadXMLDoc(dname) 
{ 
if (window.XMLHttpRequest) 
    { 
    xhttp=new XMLHttpRequest(); 
    } 
else 
    { 
    xhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xhttp.open("GET",dname,false); 
xhttp.send(); 
return xhttp.responseXML; 
} 

これをスクリプトブロックに追加すると、作業が開始される場合があります。

関連する問題