2010-04-01 6 views
6

J'essaye d'extraire les valeurs StateLongName et StateShortName du xml ci-dessous.Comment trouver/extraire des données de xml avec jQuery

Je sais qu'il doit y avoir une façon simple et élégante de faire cela avec jQuery.

<NewDataSet> 
    <Table> 
    <StateLongName>Alabama</StateLongName> 
    <StateShortName>AL</StateShortName> 
    </Table> 
    <Table> 
    <StateLongName>Alaska</StateLongName> 
    <StateShortName>AK</StateShortName> 
    </Table> 

...elments removed for brevity 

</NewDataSet> 

Voici ce que j'ai essayé.

Chargez le XML depuis le haut dans un nom de variable Javascript xml.

Essayez # 1

$(xml).find("TABLE").each(function() 
{ 
    var stateName = $(this).find("StateLongName").innerText; 
    var stateCode = $(this).find("StateShortName").innerText; 
}); 

Essayez # 1 ne trouve rien et ne va à l'intérieur pour charger les variables stateName et statecode.

Essayez # 2

$(xml).find("StateLongName").each(function() 
{ 
    var stateName = $(this).find("StateLongName").innerText; 
    var stateCode = $(this).find("StateShortName").innerText; 
}); 

Essayez # 2 ne trouver des correspondances, mais le stateName et statecode sont pas définis.

Essayez # 3

$(xml).find("StateLongName").each(function() 
{ 
    var stateName = $($(xml).find('StateLongName').parent()[0].innerHTML)[1].data; 
    var stateCode = $($(xml).find('StateLongName').parent()[0].innerHTML)[5].data; 
}); 

Essayez # 3 œuvres, mais il doit y avoir une meilleure façon. S'il te plaît, éclaire-moi.

Merci pour votre temps!

+0

mépris ma réponse - je pensais que votre question était plus générale! –

Répondre

7

Il est sensible à la casse, utilisez "Table" comme ceci:

$(xml).find("Table").each(function() { 
    var stateName = $(this).find("StateLongName").text(); 
    var stateCode = $(this).find("StateShortName").text(); 
}); 

Mise à jour: Désolé celui-ci était un peu déconcertant, ne pas utiliser <table>, il la traite comme html la création d'un <tbody> et les choses deviennent étranger à partir de là :) Si vous avez changé à juste buter toute autre chose, ça va marcher, voici un exemple avec elle changé <tabl>: http://jsfiddle.net/Yvetc/

Voici une page de test nu complet:

<html> 
    <head>  
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    var xml="<NewDataSet><Tabl><stateLongName>Alabama</stateLongName><stateShortName>AL</StateShortName></Tabl><Tabl><StateLongName>Alaska</StateLongName><StateShortName>AK</StateShortName></Tabl></NewDataSet>"; 
    $(xml).find("Tabl").each(function() { 
     var stateName = $(this).find("StateLongName").text(); 
     var stateCode = $(this).find("StateShortName").text(); 
     alert("State: " + stateName + " Code: " + stateCode); 
    }); 
    </script> 
    </head> 
    <body> 
    </body> 
</html> 
+0

J'aime définir 'var $ this = $ (this)' quand on utilise cette valeur plus d'une fois. –

+0

Merci pour la réponse rapide Nick. Malheureusement, changer l'affaire n'a toujours pas trouvé de correspondance. –

+0

Il semble que la sensibilité à la casse ne s'applique PAS à la méthode .find(). Toute version de cas de $ (xml) .find ("statelongname") correspond, tandis que n'importe quelle version de cas de caractères de $ (xml) .find ("table") ne correspondra pas. –

2
$.ajax({ 
      type: "GET", 
      url: "labels.xml", 
      dataType: "xml", 
      success: function(xml) { 
       $(xml).find('label').each(function(){ 
        var id_text = $(this).attr('id') 
        var name_text = $(this).find('name').text() 

        $('<li></li>') 
         .html(name_text + ' (' + id_text + ')') 
         .appendTo('#update-target ol'); 
       }); //close each(
      } 
     }); //close $.ajax(

exemple xml pour cela:

<?xml version="1.0" encoding="iso-8859-1"?> 


<labels> 
    <label id='ep' added="2003-06-10"> 
    <name>Ezra Pound</name> 
    <address> 
     <street>45 Usura Place</street> 
     <city>Hailey</city> 
     <province>ID</province> 
    </address> 
    </label> 
    <label id='tse' added="2003-06-20"> 
    <name>Thomas Eliot</name> 
    <address> 
     <street>3 Prufrock Lane</street> 
     <city>Stamford</city> 
     <province>CT</province> 
    </address> 
    </label> 
    <label id="lh" added="2004-11-01"> 
    <name>Langston Hughes</name> 
    <address> 
     <street>10 Bridge Tunnel</street> 
     <city>Harlem</city> 
     <province>NY</province> 
    </address> 
    </label> 
    <label id="co" added="2004-11-15"> 
    <name>Christopher Okigbo</name> 
    <address> 
     <street>7 Heaven's Gate</street> 
     <city>Idoto</city> 
     <province>Anambra</province> 
    </address> 
    </label> 
</labels>