|
Hola Mundo en AJAX |
Escrto por pak0 |
Nuestro primer codigo en AJAX, como en la mayoria de los lenguajes comenzaremos con el famoso "Hola Mundo". Pero antes vamos a comprender un poco que es
AJAX; son siglas de "Asynchronous JavaScript and XML". Es decir AJAX no es una nueva tecnogolia como tal, es la combinación de varias tecnologias.
Para explicar de una manera sencilla y que cualquiera pueda entender, lo que AJAX hace es trabajar asincronicamente, es decir independiente de la
comunicacion con el servidor. Los usuarios ya no tendran que esperar a que se realizen una serie de "procesos" entre tu web y el servidor, si no que esto se
hara "background".Esto es la posibilidad de hacer peticiones al servidor sin tener que volver a cargar la página.
Bueno despues de haber tratado de explicar lo que es AJAX.. vayamos directo a nuestro primer ejemplo, es decir el famoso Hola Mundo, posiblemente no se note
en un ejemplo como este la utilidad, pero será para comenzar a entender como se inicia una aplicacion AJAX.
Lo primero que debemos hacer para CUALQUIER aplicacion AJAX que vayamos a desarrollar es realizar la peticion HTTP al servidor. Para esto debemos crear una
instancia de una clase, Para Internet Explorer(>v6) se hace uso del objeto ActiveX, el cual en javascript es llamado mediante: XMLHTTP. Para los demas
navegadores haremos uso del objeto XMLHTTPRequest. Entonces la primera parte de nuestro codigo queda asi:
if(window.XMLHttpRequest){ MiPeticion = new XMLHttpRequest(); } else if(window.ActiveXObject){ MiPeticion = new ActiveXObject("Microsoft.XMLHTTP"); }
MiPeticion.onreadystatechange = function(){ if(MiPeticion.readyState == 4) { if(MiPeticion.status == 200) { alert(MiPeticion.responseText); } } }
MiPeticion.open('GET', 'HMAJAX.txt', true); MiPeticion.send(null);
window.onload = NuestraFuncionCompleta;
function MiPrimeraFuncionAjax() { if(window.XMLHttpRequest){ MiPeticion = new XMLHttpRequest(); } else if(window.ActiveXObject){ MiPeticion = new ActiveXObject("Microsoft.XMLHTTP"); } MiPeticion.onreadystatechange = function(){ if(MiPeticion.readyState == 4) { if(MiPeticion.status == 200) { alert(MiPeticion.responseText); } } } MiPeticion.open('GET', 'HMAJAX.txt', true); MiPeticion.send(null); } MiPrimeraFuncionAjax();