Загрузить XML-данные с использованием Ajax и Javascript при получении XML-содержимого в виде XML-файла

Question

Я пытаюсь отобразить данные из xml-файла, сначала получив содержимое xml-файла и сохранив его в XML DOM. После создания объекта DOM он затем разбирается. Я использовал цикл for, чтобы получить данные от каждого дочернего узла родительского узла, но так или иначе отображаются только данные второго узла.

Это код, где ошибка:

xmlhttp.open("GET","company.xml", false); //sets the request for calling company.xml 
    xmlhttp.send(); //sends the request 

    xmlDoc = xmlhttp.responseXML; //sets and returns the content as XML DOM 

    //parsing the DOM object 

    var employeeCount = xmlDoc.getElementsByTagName("Employee"); 

    for(i=0; i<employeeCount.length; i++) 
    { 
     document.getElementById("firstName").innerHTML = xmlDoc.getElementsByTagName("FirstName")[i].childNodes[0].nodeValue; 
     document.getElementById("lastName").innerHTML = xmlDoc.getElementsByTagName("LastName")[i].childNodes[0].nodeValue; 
     document.getElementById("contactNum").innerHTML = xmlDoc.getElementsByTagName("ContactNo")[i].childNodes[0].nodeValue; 
    } 

XML-файл:

<?xml version="1.0"?> 
<Company> 
<Employee category="technical"> 
<FirstName>Tanmay</FirstName> 
    <Nickname>Tania</Nickname> 
<LastName>Patil</LastName> 
<ContactNo>1234567890</ContactNo> 
</Employee> 
<Employee category="non-technical"> 
<FirstName>Taniya</FirstName> 
<LastName>Mishra</LastName> 
<ContactNo>1234667898</ContactNo> 
</Employee> 
</Company> 

Это выход:

Как я могу отобразить данные от узла [0]? Любые предложения будут оценены. Благодарю.

Answer 1

Проблема заключается в том, что вы перезаписать данные из предыдущего Employee на каждой итерации:

for(i=0; i<employeeCount.length; i++) 
{ 
    document.getElementById("firstName").innerHTML = xmlDoc.getElementsByTagName("FirstName")[i].childNodes[0].nodeValue; 
    document.getElementById("lastName").innerHTML = xmlDoc.getElementsByTagName("LastName")[i].childNodes[0].nodeValue; 
    document.getElementById("contactNum").innerHTML = xmlDoc.getElementsByTagName("ContactNo")[i].childNodes[0].nodeValue; 
} 

Вот почему только последний Employee данные остаются в innerHTML с, в конце концов.