[JS] XML omzetten naar HTML-lijst

[Verwijderd]

Ik heb een JavaScript gemaakt dat uit een XML-bestand (opgeroepen via XMLHttpRequest) met de volgende structuur:

code:

<?xml version="1.0">
<items>
  <item id="1">Inhoud</item>
  <item id="2">Nog meer inhoud</item>
  ...etc...
</items>

een HTML-lijdt (ul, li enzovoorts) hoort te maken. Het probleem is dat ik via de W3C-DOM functies geen data kan uitlezen uit de <item> elementen. Het script ziet wel dat er 17 (in het geval van het voorbeeld dus 2) <item> elementen staan, maar als ik dan vervolgens de inhoud van dat element probeer op te roepen met nodeValue, textNodeValue of zelfs innerHTML wordt er steevast "undefined" gegeven. Het script ziet er als volgt uit:

code:

function showOverview(getWhat) {
  http.open('GET', 'xml.php?get=' + getWhat);
  http.onreadystatechange = function() { 
    if (http.readyState == 4) {
      if (!http.responseXML) {
        alert('Fout: ' + http.responseText);
      }
      var bigList = document.createElement('ul');
      var li = document.createElement('li');
      var a = document.createElement('a');
      var XML = http.responseXML;
      for (i = 0; i < XML.getElementsByTagName('item').length; i++) {
        var itemData = XML.firstChild.childNodes[i].textNodeValue;
        var itemSub = li.cloneNode(false);
        var itemLink = a.cloneNode(false);
        itemLink.href = 'javascript: getPage(\'' + itemData + '\');';
        itemLink.appendChild(document.createTextNode(itemData));
        itemSub.appendChild(itemLink);
        bigList.appendChild(itemSub);
      }
      site.appendChild(bigList);
    } 
  }
  http.send(null);
}

Voor de volledigheid: "http" is een XmlHttpRequest object, "site" is een verwijzing naar de <div> waarin de lijst moet komen en het XML-bestand heeft als Content-type text/xml. Het script is ietwat versimpeld omdat het anders teveel ruimte zou innemen. Hulp zou ik erg op prijs stellen

[crisp]

Het lijkt mij dat dit wel zou moeten werken:

JavaScript:

var itemNodes = XML.getElementsByTagName('item'), i = 0, j = itemNodes.length;
var itemData;
while (i < j)
{
  itemData = itemNodes[i].firstChild.nodeValue;
  i++;
}

[Verwijderd]

Het werkt nu inderdaad. Blijkbaar moet je getElementsByTagName[ i] i.p.v. childNodes[ i] gebruiken, hoewel ze naar hetzelfde zouden moeten verwijzen.

In ieder geval bedankt!

[Bluestorm]

Een oorzaak kan zijn dat in childNodes behalve je item elementen ook textnodes met stukjes tekst ( spaties, etc) zitten.

edit:
Verkeerd gelezen... al is het wel één van de problemen als je childNodes gebruikt ipv getElementsByTagName

[ Voor 34% gewijzigd door Bluestorm op 06-11-2005 22:21 ]

[crisp]

Verwijderd schreef op zondag 06 november 2005 @ 22:08:
Het werkt nu inderdaad. Blijkbaar moet je getElementsByTagName[ i] i.p.v. childNodes[ i] gebruiken, hoewel ze naar hetzelfde zouden moeten verwijzen.

In ieder geval bedankt!

Je element 'item' bevat elke keer maar 1 childNode; je had wel dit kunnen doen:

JavaScript:

var itemRoot = document.getElementsByTagName('items')[0];
var i = 0, j = itemRoot.childNodes.length;
var item, itemData;
while (i < j)
{
  item = itemRoot.childNodes[i];
  itemData = item.firstChild.nodeValue;
  i++;
}

maar da's dan weer ingewikkelder dan noodzakelijk...

[ Voor 5% gewijzigd door crisp op 06-11-2005 22:48 ]