2010-04-01 45 views
6

Estoy tratando de extraer los valores StateLongName y StateShortName del xml a continuación.Cómo buscar/extraer datos de xml con jQuery

Sé que tiene que haber una manera simple y elegante de hacer esto con jQuery.

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

...elments removed for brevity 

</NewDataSet> 

Esto es lo que he intentado.

Cargue el xml de arriba en un nombre de variable de Javascript xml.

Try # 1

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

Trate # 1 no encontrar nada y nunca va dentro para cargar las variables statecode StateName y.

Try # 2

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

Try # 2 no encontrar coincidencias, sin embargo, el StateName y statecode se dejan sin definir.

Try # 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; 
}); 

Try # 3 obras, sino que tiene que haber una mejor manera. Por favor iluminame.

¡Gracias por su tiempo!

+0

desconocimiento mi respuesta - pensé que su pregunta era más general! –

Respuesta

7

Es mayúsculas y minúsculas, utilice "Table" así:

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

Actualización: Lo sentimos, este fue un poco desconcertante, no utilice <table>, lo trata como html crear un <tbody> y las cosas se ponen extraño desde allí :) Si la ha cambiado a simplemente colindan cualquier otra cosa, que va a trabajar, he aquí un ejemplo con el que cambió a <tabl>: http://jsfiddle.net/Yvetc/

es una página de prueba desnudo completo aquí:

<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

Me gusta definir 'var $ this = $ (this)' cuando use ese valor más de una vez. –

+0

Gracias por la respuesta rápida Nick. Desafortunadamente, cambiar el caso todavía no encontró ninguna coincidencia. –

+0

Parece que la sensibilidad de mayúsculas y minúsculas NO se aplica al método .find(). Cualquier versión de caso de $ (xml) .find ("statelongname") coincidirá, mientras que cualquier versión de caso de carácter de $ (xml) .find ("tabla") NO coincidirá. –

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(

XML de ejemplo para esto:

<?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>