Curso de jQuery-Ajax

jQuery

Tutorial para desarrollar en Web mediante jQuery.

Introducción | Efectos | html | Eventos | Ajax | Plugins  | jQueryUI

Ajax

JSON

• JavaScript Object Notation
• Se utiliza para almacenar e intercambiar información
• Más pequeño que XML y más rápido y sencillo de analizar (parsear).
• Se basa en la sintaxis del propio JavaScript para objetos.

//Objeto JSON:
{ "nombre":"Pepe" , "apellido":"Pérez" }
 
//Array JSON
{
"estudiantes": [
    { "nombre":"Juan" , "lastName":"Alcocer" }, 
    { "nombre":"Ana" , "lastName":"Serrano" }, 
    { "nombre":"Mario" , "lastName":"Gil" }
  ]
}
//sintáxis en JavaScript:
var estudiantes = [
    { "nombre":"Juan" , "lastName":"Alcocer" }, 
    { "nombre":"Ana" , "lastName":"Serrano" }, 
    { "nombre":"Mario" , "lastName":"Gil" }
  ];

¿Qué es AJAX?

• AJAX quiere decir Asynchronous JavaScript and XML.
• Sirve para cargar datos en background y mostrarlos en la web sin recargar la página.
• jQuery y AJAX:

La implementación de AJAX es distinta en función del navegador.

Podremos recibir ficheros de tipo texto, XML, html o JSON mediante http GET o POST.

Callback functions

• En JavaScript se ejecutan las sentencias línea a línea. Puede ser que una sentencia no haya terminado su ejecución y ya haya comenzado la siguiente.
• Ejemplo:

$("p").hide(1000);
alert("The paragraph is now hidden");

• Para evitar esto, pasamos la función como parámetro, y evitamos que se ejecute hasta que termina la animación. Esto se conoce como callback functions:

$("p").hide(1000,function(){
  alert("The paragraph is now hidden");
});