从XML中提取数据并将其置于HTML表格中

Question

我不是一位编码专家，所以需要您的帮助。

我有一个XML文件作为字符串变量存储在$(xml)变量中，代码如下所示。

我能够解析这个XML文件并提取数据行，但问题是提取的数据在两个值之间没有空间。

此外，我想这个提取的数据被放在表格格式5x5。使用JavaScript/jQuery的

感谢

var xmlString = $(xml).find("table_cell_value1,table_cell_value2,table_cell_value3,table_cell_value4,table_cell_value5").text(); 

Answer 1

现在好了，去一步一步的。首先你的XML格式，它应该采用以下格式（这已经是我猜的）：

<root> 
    <asset> 
     <name></name> 
     ... 
    </asset> 
    <asset> 
     <name></name> 
     ... 
    </asset> 
</root> 

在我的解决方案，我创建了这个XML这样的：

var xml = ""; 
    xml+= '<?xml version= "1.0" encoding="UTF-8"?>'; 
    xml+= '<root>'; 
     xml += '<asset>';  
     var index1 = "111"; 
     xml += '<name>'+index1+''; 
     xml += '</name>'; 

     var index2 = '111'; 
     xml += '<company>'+index2+''; 
     xml += '</company>'; 

     var index3 = '111' 
     xml += '<country>'+index3+''; 
     xml += '</country>'; 

     var index4 = '111' 
     xml += '<fname>'+index4+''; 
     xml += '</fname>'; 

     var index5 = '111'; 
     xml += '<lname>'+index5+''; 
     xml += '</lname>'; 
     xml += '</asset>'; 

     xml += '<asset>';  
     var index1 = "222"; 
     xml += '<name>'+index1+''; 
     xml += '</name>'; 

     var index2 = '222'; 
     xml += '<company>'+index2+''; 
     xml += '</company>'; 

     var index3 = '222' 
     xml += '<country>'+index3+''; 
     xml += '</country>'; 

     var index4 = '222' 
     xml += '<fname>'+index4+''; 
     xml += '</fname>'; 

     var index5 = '222'; 
     xml += '<lname>'+index5+''; 
     xml += '</lname>'; 
     xml += '</asset>';  
    xml+= '</root>'; 

所以它有两个记录，111，11 1,111,111,111和222,222,222,222,222。

接下来是XML解析器，它将为您解析此XML并填充表。我使用了DOMParser。

外环将直到资产标签（你的记录），然后在循环我提出的行并将它们添加到表的长度...

for(var i=0; i<xmlDoc.getElementsByTagName("asset").length; i++) { 
    html += '<tr><td>' + xmlDoc.getElementsByTagName("asset")[i].childNodes[0].innerHTML + '</td><td>' + xmlDoc.getElementsByTagName("asset")[i].childNodes[1].innerHTML + '</td><td>' + xmlDoc.getElementsByTagName("asset")[i].childNodes[2].innerHTML + '</td><td>' + xmlDoc.getElementsByTagName("asset")[i].childNodes[3].innerHTML + '</td><td>' + xmlDoc.getElementsByTagName("asset")[i].childNodes[4].innerHTML + '</td></tr>'; 
    //row construction ends here 
    $('#tb tr:last').after(html); //adding row to the table. 
    html = ""; //emptying this string after one row has been added to avoid multiple rows to be added in next iteration  
} 

上述循环将运行2次（因为我的xml有2条记录）并且将逐行填充表，对于第一行：111,111,111,111,111和对于第二行：222,222,222,222,222。

See the working DEMO here

如果y你有任何困惑，随时提问。