Leer archivos XML con JQuery

Desde que JQuery lleg贸 a nuestras vidas, Javascript se ha convertido en un camino de rosas 馃榾 Tanto es as铆 que en pocas l铆neas podemos conseguir el parseo completo de un archivo XML 隆Vamos a verlo!

En primer lugar hay que aclarar que podemos toparnos principalmente聽con聽tres formatos de XML diferentes:

  1. Utilizando atributos: Cada elemento guarda su informaci贸n dentro de atributos. Los atributos deber铆an utilizarse para informaci贸n predeterminada, metadatos, archivos grandes (los atributos tienden a ocupar menos bytes que los elementos).
    <?xml version="1.0" encoding="utf-8" ?>
    <Blogs>
    聽 <blog name="WebLog Expert - Powerful log analyzer"
    聽聽聽聽聽聽聽 description="Download and analyze Apache and IIS Web logs on your own PC."
    聽聽聽聽聽聽聽 url=" http://www.weblogexpert.com/"/>
    聽 <blog name="Professional drupal themes"
    聽聽聽聽聽聽聽 description="For professional drupal themes with a unique look and feel, visit TopNotchThemes.com."
    聽聽聽聽聽聽聽 url="http://www.topnotchthemes.com/"/>
    聽 <blog name="Paypal Developer Community"
    聽聽聽聽聽聽聽 description="The community for developping paypal payment processing scripts."
    聽聽聽聽聽聽聽 url="http://www.pdncommunity.com" />"
    </Blogs>
  2. Utilizando nodos/elementos: Los elementos聽contienen a su vez otros elementos llamados nodos. Se suelen utilizar para almacenar datos.
    <?xml version="1.0" encoding="utf-8" ?>
    <Blogs>
    聽 <blog>
    聽聽聽 <name>WebLog Expert - Powerful log analyzer</name>
    聽聽聽 <description>Download and analyze Apache and IIS Web logs on your own PC.</description>
    聽聽聽 <url>http://www.weblogexpert.com/</url>
    聽 </blog>
    聽 <blog>
    聽聽聽 <name>Professional drupal themes</name>
    聽聽聽 <description>For professional drupal themes with a unique look and feel, visit TopNotchThemes.com.</description>
    聽聽聽 <url>http://www.topnotchthemes.com/</url>
    聽 </blog>
    聽 <blog>
    聽聽聽 <name>Paypal Developer Community</name>
    聽聽聽 <description>The community for developping paypal payment processing scripts.</description>
    聽聽聽 <url>http://www.pdncommunity.com</url>
    聽 </blog>
    </Blogs>
  3. Mezcla de los dos anteriores.

Dependiendo del c贸mo est茅 almacenado utilizaremos un m茅todo u otro para recuperarlo.

Recuperaci贸n de atributos

//Read attributes

$.get("Attributes.xml", function (xml) {
聽聽聽 $(xml).find("blog").each(function () {

聽聽聽聽聽聽 var name = $(this).attr('name');
聽聽聽聽聽聽聽var description = $(this).attr('description');
聽聽聽聽聽聽聽var url = $(this).attr('url');

       alert(name + " " + description + " " + url);
聽聽聽 });
});

Recuperaci贸n de nodos/elementos

//Read nodes
聽 $.get("Nodes.xml", function (xml) {
聽聽聽 $(xml).find("blog").each(function () {
聽聽聽聽聽聽 var name = $(this).find('name').text();
聽聽聽聽聽聽 var description = $(this).find('description').text();
 聽聽聽聽聽 var url = $(this).find('url').text();

聽聽聽聽聽聽 alert(name + " " + description + " " + url);
聽聽聽 });
});

Lo que estamos haciendo en ambos casos es una iteraci贸n a trav茅s de each por cada elemento blog que聽tengamos en el archivo. Dependiendo del tipo que esperemos utilizaremos attr para recuperar los atributos y find para los elementos.

Espero que sea de utilidad 馃檪

隆Saludos!