July 7
Asynchronous JavaScript and XML, AJAX, è una tecnica che utilizza diverse tecnologie di Internet per sviluppare applicazioni web lato client interattive. JavaScript è utilizzato per leggere un file XML e visualizzare i contenuti formattati nella pagina Web utilizzando Dynamic HTML (DHTML) e Document Object Model (DOM). Really Simple Syndication (RSS) feed sono file in formato XML che contengono informazioni e link per notizie, blog, e anche informazioni podcast. Recupero e la visualizzazione di un feed RSS è un ottimo modo per iniziare con AJAX.
1 Creare un nuovo file JavaScript. Salvarlo con il nome file "rss.js".
2 Aggiungere la seguente funzione. La funzione intializes e restituisce un oggetto XMLHttpRequest. XMLHttpRequest è il cuore di programmazione AJAX. Le vecchie versioni di Internet Explorer inizializzare un XMLHttpRequest utilizzando un ActiveX al posto della finestra.
function initXmlHttpReq() {
var x ;
if (window.XMLHttpRequest) {
x = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
x = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
alert("Your browser does not support this feature.");
return ;
}
tornare x;
}
3 Aggiungere la seguente funzione per gestire l'azione di analisi e la visualizzazione di feed RSS quando il file viene recuperato. readyState indica lo stato del file recupero, ed è pari a 4 quando il file è stato recuperato correttamente. Il documento avrà un tag DIV con id "rss". Lo script scriverà il RSS in questo DIV.
function stateChange() {
if (xmlreq.readyState==4) {
var data = xmlreq.responseXML;
var elem = document.getElementById("rss");
parseRss(data, elem);
}
}
4 Aggiungere le seguenti due funzioni per l'analisi e la scrittura dei dati RSS memorizzati nell'oggetto dati. Ogni RSS titolo è contenuto nell'elemento "voce", che contiene il titolo, collegamento e altre informazioni di elementi figlio. parseRss costruisce una lista non ordinata, popola con le informazioni dal feed RSS, e lo scrive un DIV con l'id "rss" nella pagina web utilizzando lo script. GetVal viene utilizzato per estrarre i dati dai nodi figlio, e mantiene le parseRss funzionano un po 'più pulito e leggibile.
function parseRss(data, elem) {
elem.innerHTML = "<h2>Feed<h2>";
var items = data.getElementsByTagName("item");
var list = document.createElement("ul");
for (var i = 0 ; i < items.length ; i++) {
var listItem = document.createElement("li");
var linkItem = document.createElement("a");
linkItem.setAttribute("href", getVal(items[i],"link"));
linkItem.appendChild(document.createTextNode(getVal(items[i],"title")));
listItem.appendChild(linkItem);
list.appendChild(listItem);
}
elem.appendChild(list);
}
Funzione GetVal (obj, tag) {
tornare obj.getElementsByTagName (tag) [0] .firstChild.nodeValue;
}
5 Aggiungere la seguente funzione che apre il feed RSS, innescando l'analisi e la scrittura dei contenuti alla pagina web.
function makeRequest () {
xmlreq.open("GET", url, true);
xmlreq.send(null);
}
6 Aggiungere le seguenti righe alla fine dello script. Queste linee eseguiranno al caricamento della pagina. Modificare l'URL "rss.xml" per l'URL del feed RSS.
var xmlreq = initXmlHttpReq();
var url = "rss.xml" ;
xmlreq.onreadystatechange=stateChange;
7 Utilizzare lo script inserendo lo script in zona della testa della tua pagina web:
<Script type = "text / javascript" per l'attributo onload del tag BODY:
<Body onload = "makeRequest ();">