Javascriptのみを使用してXMLファイルを読む

Question

私はJavascriptを使用して読む必要があるXMLファイルを持っています。読み込まれるテキストは、3つのラベルタグ内に表示する必要があります。

私はXMLファイルを読むことができますが、3つのラベルの中にテキストを表示しようとすると、この場合は「Pavarotti Gala Concert」というXMLファイルから最後に読み込まれたものだけが表示されます。

私が印刷できるようにしたい：

ラベル1 = "エンパイア・バーレスク"

ラベル2 = "あなたの心を隠す"

ラベル3 = "パバロッティガラ・コンサート"

私は間違って何をしていますか？

XMLファイル

<?xml version="1.0" encoding="UTF-8"?> 
<CATALOG> 
    <CD> 
     <TITLE>Empire Burlesque</TITLE> 
     <ARTIST>Bob Dylan</ARTIST> 
    </CD> 
    <CD> 
     <TITLE>Hide your heart</TITLE> 
     <ARTIST>Bonnie Tyler</ARTIST> 
    </CD> 
    <CD> 
     <TITLE>Pavarotti Gala Concert</TITLE> 
     <ARTIST>Luciano Pavarotti</ARTIST> 
    </CD> 
</CATALOG> 

JAVASCRIPT

 if (window.XMLHttpRequest) { 
      xmlhttp = new XMLHttpRequest(); 
     } else { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 

     xmlhttp.open("GET", "text.xml", false); 
     xmlhttp.send(); 
     xmlDoc = xmlhttp.responseXML; 

     var x = xmlDoc.getElementsByTagName("CD"); 

     for (i = 0; i < x.length; i++) { 

      var titleName = x[i].getElementsByTagName("TITLE")[0].innerHTML; 

      document.getElementById("text1").innerHTML = titleName ; 
      document.getElementById("text2").innerHTML = titleName ; 
      document.getElementById("text3").innerHTML = titleName ; 
    }  
} 

HTML

<label id="text1"></label> 
<label id="text2"></label> 

Answer 1

私はXMLファイルを読むことができますが、 のラベルの中にテキストを表示しようとすると、XMLファイル から読み込まれた最後のものだけが表示されます。この場合は "Pavarotti Gala Concert"です。あなたがtext1、text2、text3の全てにtitleNameを設定しているループで

ので、それは彼らがすべての最後の項目に等しいだという意味があります。

は交換してみてください：

document.getElementById("text1").innerHTML = titleName ; 
document.getElementById("text2").innerHTML = titleName ; 
document.getElementById("text3").innerHTML = titleName ; 

で：

document.getElementById("text" + (i + 1)).innerHTML = titleName; 

EDIT：

var titleName = x[i].getElementsByTagName("TITLE")[0].innerHTML; 

if (tileName.indexOf('hide') !== -1) { 
    document.getElementById("text1").innerHTML = "Hide your heart"; 
    document.getElementById("text2").innerHTML = ""; 
    document.getElementById("text3").innerHTML = ""; 
    break; // stop looping 
}