Programmazione Web » Javascript » Elaborare Feed Rss con Javascript
Elaborare Feed Rss con Javascript
Difficoltà:
Scritto da Alberto Giuliani
Sito Web: http://www.agwebsolutions.it 
Questo tutorial è stato letto 1138 volte
Il sistema di distribuzione delle news RSS acquista sempre più successo per la sua semplicità, e allo stesso tempo per la sua maneggiabilità da parte di qualsiasi utenza/sistema. Esso può infatti essere manipolato e visualizzato da qualsiasi dispositivo.
In questo tutorial vedremo come permettere agli utenti di sfruttare i FEED RSS tramite un codice Javascript e visualizzare nel proprio sito l'elenco delle informazioni.
Prendiamo come esempio il feed di AG web solutions presente a questo link . Come si può notare, la struttura del feed è pressochè questa:
<channel>
<item>
<title>Titolo</title>
<link>URL della news</link>
</item>
....
</channel>
Ogni elemento (item) ha dei sottolivelli, "title" e "link" in questo caso. Il nostro obiettivo è realizzare una lista in cui ogni voce ha come testo il "title" e come collegamento il "link". Quindi una cosa del genere:
<a href="link">title</a>
Javascript permette di elaborare file XML tramite l'oggetto XMLDOM. Si tratta sicuramente del metodo migliore.
Creeremo quindi un file elab.js che conterrà il codice per l'elaborazione:
// Interpretazione Javascript dei FEED RSS
//Creo l'oggetto XMLDOM
var objXml = new ActiveXObject("Microsoft.XMLDOM");
// Procedo con il caricamento del file
objXml.async = false;
// Settare qui sotto il percorso
objXml.load("http://lnx.egq.it/rss/tutorial-xml.php");
// Estraggo i vari elementi che mi interessano
var titolo = objXml.getElementsByTagName("item/title");
var collegamento = objXml.getElementsByTagName("item/link");
var i = 0;
// Stampo a video l'elenco delle news
with(document)
{
for (i=0; i<titolo.length; i++)
{
write("<a href=" +collegamento[i].text + ">" + titolo[i].text + "</a><br>");
}
}
// Chiudo l'oggetto XML
objXml.Close();
La struttura è stata volutamente lasciata priva di processi di controllo di errori, per rendere più comprensibile il codice. A voi il compito di personalizzarlo.
Quindi per richiamare il file nelle nostre pagine Html, dovremo inserire questo codice:
<script type="text/javascript" language="javascript" src="elab.js"></script>
in cui bisogna settare l'attributo src che indica il percorso del file "elab.js". Questo codice va inserito nel punto della pagina in cui volete visualizzare l'elenco.
Aggiungi questo tutorial ai preferiti
