|
|
| Línea 38: |
Línea 38: |
| | ===¿Qué es AJAX?=== | | ===¿Qué es AJAX?=== |
| | *AJAX quiere decir Asynchronous JavaScript and XML. | | *AJAX quiere decir Asynchronous JavaScript and XML. |
| − | *Sirve para cargar datos en background y mostrarlos en la web sin recargar la página. | + | *Sirve para cargar datos en background y mostrarlos en la web sin necesidad de recargar la página, por eso lo de asíncrono. |
| | + | *XHR significa XML HTTP REQUEST y es hablar de lo mismo. |
| | + | *Lo podemos ver en el inbox de gmail, en google maps cuando aplicamos el zoom, etc. |
| | *jQuery y AJAX: | | *jQuery y AJAX: |
| | :La implementación de AJAX es distinta en función del navegador. | | :La implementación de AJAX es distinta en función del navegador. |
| Línea 45: |
Línea 47: |
| | | | |
| | <div class="slide"> | | <div class="slide"> |
| | + | |
| | === Sintaxis === | | === Sintaxis === |
| | $(selector).load(URL,data,callback); | | $(selector).load(URL,data,callback); |
Revisión de 10:38 30 oct 2012
jQuery
Tutorial para desarrollar en Web mediante jQuery.
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 necesidad de recargar la página, por eso lo de asíncrono.
- XHR significa XML HTTP REQUEST y es hablar de lo mismo.
- Lo podemos ver en el inbox de gmail, en google maps cuando aplicamos el zoom, etc.
- 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.
Sintaxis
$(selector).load(URL,data,callback);
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("demo_test.txt");
});
});
</script>
</head>
<body>
<div id="div1"><h2>jQuery AJAX cambiará este texto</h2></div>
<button>Ejecutar AJAX</button>
</body>
</html>
- 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");
});
