Fatal编程技术网
  • javascript/
  • Javascript 在整个数组中循环-所有索引

Javascript 在整个数组中循环-所有索引

javascript arrays ajax xml loops

Javascript 在整个数组中循环-所有索引,javascript,arrays,ajax,xml,loops,Javascript,Arrays,Ajax,Xml,Loops,对于一项任务，我需要显示专辑标题和所有歌曲的列表。但我只能在每张专辑中播放第一首歌。我如何显示它们？我假设我需要更改索引值，但我不确定如何编写它来获得所有的值。我的代码如下 <style> table, th, td { border: 1px solid black; border-collapse: collapse; } th, td { paddin

对于一项任务，我需要显示专辑标题和所有歌曲的列表。但我只能在每张专辑中播放第一首歌。我如何显示它们？我假设我需要更改索引值，但我不确定如何编写它来获得所有的值。我的代码如下

    <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>


表，th，td{
边框：1px纯黑；
边界塌陷：塌陷；
}
th，td{
填充物：5px；
}
函数loadDoc（）{
//此函数将加载xml文件并将其连接到网页
var xhttp=newXMLHttpRequest（）；
//这用于与服务器交换数据，允许在不重新加载页面的情况下更改页面的某些部分
xhttp.onreadystatechange=函数（）{
//这定义了readystate属性更改时要调用的函数
if（this.readyState==4&&this.status==200）{
//这表示如果请求已完成（readystate==4），并且返回的状态为ok（This.staus==200）
这首歌；
//这将运行函数以显示xml文件中的数据
}
};
open（“GET”，“CDLibrary.xml”，true）；
//这将获取xml文件
xhttp.send（）；
//这将向服务器发送一个请求
}
函数（xml）{
//此函数将从xml文件中提取和显示数据
var i；
var xmlDoc=xml.responseXML；
//这将返回包含对我的请求的响应的文档
var table=“ArtistTitle”；
//这摆好了桌子
var CdList=xmlDoc.getElementsByTagName（“CD”）；
//这将从xml文件创建一个数据数组

对于（i=0；i我猜您需要第二个
for
循环，用于
标题
/
曲目
：-


for（i=0；i
我猜您需要第二个
for
循环，用于
标题
/
曲目
：-


for（i=0；i
向我展示您的xml文件Adiemus:圣殿之歌卡尔·詹金斯（作曲家）Adiemus 3:48 Tintinabulum 10:57 Cantus Inaequalas 3:13 Cantus Inalitus 5:35这只是文件的一个片段，整个过程基本相同。它只是列表中的一项。你怎么能期望打印所有歌曲？我不明白你的意思，所有曲目都需要在同一个标记中吗？像这样，让我看看你的xml文件Adie缪斯：圣殿之歌卡尔·詹金斯（作曲家）Adiemus 3:48 Tintinabulum 10:57 Cantus Inaequalas 3:13 Cantus Inalitus 5:35这只是文件的一个片段，整个过程基本相同。它只是列表中的一项。你怎么能期望打印所有歌曲？我不明白你的意思，所有的曲目都需要在同一个标记中吗？这样就不会更改数据了显示。这不会更改显示的数据。