jQuery: parsing di una Google Sitemap

Con jQuery e i suoi metodi AJAX è possibile effettuare il parsing di qualsiasi documento in formato XML. In questo articolo vedremo come effettuare il parsing di una sitemap di Google.

Struttura di un file sitemap.xml

Una sitemap è un file XML che ha la seguente struttura:

<?xml version="1.0" encoding="UTF-8"?>
<urlset
      xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
            http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
      <url>
  <loc>http://www.css-zibaldone.com/</loc>
  <priority>1.00</priority>
  <lastmod>2008-08-10T06:03:54+00:00</lastmod>
  <changefreq>monthly</changefreq>
</url>

<!-- si ripete -->
</urlset>

I dati rilevanti sono contenuti all'interno dell'elemento url e sono loc (l'URL del documento) e lastmod (la data dell'ultima modifica).

Usare jQuery

Per prima cosa creiamo una funzione helper per formattare le date in italiano:

function formatDate(timestamp) {

   var dateParts = timestamp.split('-');
   
   var year = dateParts[0];
   var rawMonth = dateParts[1];
   var month;
   var day = dateParts[2];
   
   switch(rawMonth) {
   
       case '01':
         month = 'Gennaio';
         break;
       case '02':
         month = 'Febbraio';
         break;
       case '03':
         month = 'Marzo';
         break;
       case '04':
         month = 'Aprile';
         break;
       case '05':
         month = 'Maggio';
         break;
       case '06':
         month = 'Giugno';
         break;
        case '07':
         month = 'Luglio';
         break;
       case '08':
         month = 'Agosto';
         break;
       case '09':
         month = 'Settembre';
         break;
        case '10':
         month = 'Ottobre';
         break;
       case '11':
         month = 'Novembre';
         break;
       case '12':
         month = 'Dicembre';
         break;
       default:
         break;

   
   
   }
  
   return month + ' ' + day + ',' + ' ' + year;  
}

Quindi usiamo il metodo $.get() per effettuare il parsing del file XML:

$(document).ready(function() {

    $('<ul id="sitemap"></ul>').insertAfter('h1');

    $.get('sitemap.xml', function(xml) {
    
        $(xml).find('loc').each(function() {
	
	var rawUrl = $(this).text();
	var rawLastMod = $(this).parent().find('lastmod').text();
	var $url;
	var $lastMod;
	var timestamp;
	var $li = $('<li></li>');
	
	if(rawUrl.indexOf('index.html') != -1) {
	
	     $url = rawUrl.replace('index.html', '');
	
	} else {
	
	     $url = rawUrl;
	
	}
	
	timestamp = rawLastMod.replace(/T.+/g, '');
	$lastMod = formatDate(timestamp);
	
	$li.html('<a href="' + $url + '">' + $url + '</a>' + '<div class="lastmod">Ultima modifica: ' + $lastMod + '</div>');
	
	$li.appendTo('#sitemap');
	
	
	
	
        });
    
    
    });


});

Se un URL termina con index.html eliminiamo questa stringa dall'URL, in quanto si tratta di un file per cui esiste già una direttiva del server a livello di indici delle directory.

Potete visionare l'esempio finale in questa pagina.