2016-10-23 2 views
1

Для выполнения задачи мне нужно отобразить список названий альбомов и всех песен. Но я застрял только для того, чтобы первая песня отображалась для каждого альбома. Как мне отобразить их все? Я предполагаю, что мне нужно изменить значение индекса, но я не уверен, как его записать, чтобы получить все значения. Мой код ниже.Цитирование по всему массиву - все индексы

<style> 
     table, th, td { 
      border: 1px solid black; 
      border-collapse: collapse; 
     } 
     th, td { 
      padding: 5px; 
     } 
    </style> 

    <script> 
    function loadDoc() { 
    // This function will load the xml file and connect it to the webpage 
     var xhttp = new XMLHttpRequest(); 
     // This is used to exchange data with the server, allowing for parts of the page to change without reloading the page 
     xhttp.onreadystatechange = function() { 
     // This defines a function to be called when the readystate property changes 
      if (this.readyState == 4 && this.status == 200) { 
      // This states that if the request is finished (readystate == 4) and the status returned is ok (this.staus == 200) 
       extractSongs(this); 
       // This runs the function to display the data from the xml file 
      } 
     }; 
     xhttp.open("GET", "CDLibrary.xml", true); 
     // This gets the xml file 
     xhttp.send(); 
     // This sends a request to the server 
    } 
    function extractSongs(xml) { 
    // This function will extract and display data from the xml file 
     var i; 
     var xmlDoc = xml.responseXML; 
     // This returns the document containg a response to my request 
     var table="<tr><th>Artist</th><th>Title</th></tr>"; 
     // This sets up the table 
     var CdList = xmlDoc.getElementsByTagName("CD"); 
     // This creates an array of the data from the xml file 
     for (i = 0; i <CdList.length; i++) { 
     // This will loop through the array by the number of cds in the array 
     table += "<tr><td>" + 
     CdList[i].getElementsByTagName("title")[0].childNodes[0].nodeValue + 
     "</td><td>" + 
     CdList[i].getElementsByTagName("track")[0].childNodes[0].nodeValue + 
     "</td></td>" ; 
     // These display the elements by the tag name and generate them as table data 
     } 
     document.getElementById("CdCollection").innerHTML = table; 
     // This gets the table from the html and makes it equal to the table from the javascript 
    } 
    </script> 
</head> 

<body> 
<h1>My CD Collection</h1> 

<button type="button" onclick="loadDoc()">Get my collection</button> 
<br><br> 
    <table id="CdCollection"></table> 
    </body> 

+0

показать мне ваш XML-файл – Mahi

+0

Adiemus : Песни святилища Карл Дженкинс (композитор) Adiemus 3:48 тинтиннабулум 10:57 Cantus Inaequalis 3:13 Cantus Insolitus 5:35 Это просто фрагмент файла, в основном тот же самый на всем протяжении. –

+0

Это только 1 элемент в списке. как вы могли ожидать печати всех песен – Mahi

ответ

0

Я предполагаю, что вам нужен 2-ой for цикла для для title/track: -

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

    var titleCount = CdList[i].getElementsByTagName("title").length; 

    for (j = 0; j < titleCount; j++){ 

     // This will loop through the array by the number of cds in the array 
     table += "<tr><td>" + 
     CdList[i].getElementsByTagName("title")[j].childNodes[0].nodeValue + 
     "</td><td>" + 
     CdList[i].getElementsByTagName("track")[j].childNodes[0].nodeValue + 
     "</td></td>"; 
     // These display the elements by the tag name and generate them as table data 
    } 
} 
+0

Это не изменило отображаемые данные. –

Смежные вопросы