Javascript：從從 XML 文件導入數據切換到從 JS object 數組導入數據

Question

我需要編輯一個腳本，從從 xml 文件讀取 XML 數據切換到從 JS object 數組讀取數據。

讓我們假設 xml 文件是x.xml ：

<xml>
   <location>
     <name>cafe 1</name>
     <address>1 cafe st</address>
   </location>
   <location>
     <name>cafe 2</name>
     <address>2 cafe st</address>
   </location>
</xml>

下面的代碼使用 xml 文件中的數據填充數組

$.ajax({
               type: "GET",
               url: "x.xml",
               dataType: "xml",
               success: function(xml) {    
                   $(xml).find('location').each(function(){
   i +=1;
                       var name = $(this).find('name').text();
                       var address = $(this).find('address').text();
                     
                        table[i] = {name:name, address:address};
                       
                               
                   });

..我可以將 output 重寫為

var table = [
                  {"name":"cafe 1", "address":"1 cafe st"},
                  {"name":"cafe 2", "address":"2 cafe st"},
                  ]

...並使用調用數組中的數據

var m; 
for ( m = 1; m < table.length-1; m++) {

                      if (table[m].name == "cafe 1" ....

Answer 1

你基本上有它，雖然我在這里簡化了你的代碼

 let xml = `<xml> <location> <name>cafe 1</name> <address>1 cafe st</address> </location> <location> <name>cafe 2</name> <address>2 cafe st</address> </location> </xml>` let table = [] $(xml).find('location').each(function() { table.push({ name: $(this).find('name').text(), address: $(this).find('address').text() }); }); table.forEach(row => { $('#theTable').append(`<tr><td>${row.name}</td><td>${row.address}</td></tr>`) })

 #theTable td { padding:5px; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id='theTable' border='1'><tr><td>Name</td><td>Address</td></tr></table>