Ajax

Como hemos explicado hasta ahora JavaScript es un lenguaje que se ejecuta en el cliente, pero normalmente hay que ejecutar la pagina completa, asi vimos por ejemplo que si usamos document.write() perdiamos todo el contenido de la pagina y nos quedabamos unicamente con lo que enviamos como parametro de este metodo.

Ajax permite realizar peticiones asincronas sin necesidad de recargar toda la pagina, mejorando la interaccion de usuario. Ajax es una ampliacion del conjunto de herramioentas wev que Microsdoft introdujo en 1998 con su contro ActiveX. En 2005 Google empezo a usar el JavaScript asincrono y XML.

var xhr;
if (window.ActiveXObjet){
   xhr = new ActiveXObject("Microdoft.XMLHTTP");
}else if (window.XMLHttpRequest){
   xhr = new XMLHttpRequest();
}else{
   throw new Error("Ajax no es soportado en este navegador");
}

Lamentablemente cada navegador implemento a su manera el Ajax por lo que es casi obligatorio hoy en dia usar jQuery para implementarlo.

1. Obtener contenido con jQuery

La idea es bastante simple, abrir la fuente que es el contenido del recurso del lado del servidor (por ejemplo PHP) y poner su resultado en algun contenedor.

$('contenedor').load('fuente');

La fuente consta de 3 parametros:

Cuando los parametros se envian en forma de cadena usa el metodo HTTP Post y si usas un objeto o matriz se usa HTTP Get.

<Button id=pon></Button>
<div id=resp></div>
<Script>
$(document).on('click','#pon',function(){
   $('#resp').load('prueba.php');
});
</Script>

1. Obtener datos con $.post

3. Obtener datos con $.get

4. Obtener datos con $.getJSON

5. Obtener datos con $.ajax

Se puede recurrir a los métodos.