Como hacer una petición ajax con jquery para la programación html5 y css3

El propósito principal de una biblioteca como jQuery AJAX es simplificar peticiones AJAX para HTML5 y CSS3 programadores. Es difícil de creer lo fácil que puede ser con jQuery.

Cómo incluir un archivo de texto con AJAX

Echa un vistazo a este código limpio:

El HTML es muy limpio. Simplemente crea un div vacío llamado salida.

En este ejemplo se hace uso de AJAX, por lo que si no está funcionando, es posible que tenga que recordar algunos detalles sobre cómo funciona AJAX. Un programa que utiliza AJAX se debe ejecutar a través de un servidor web, no sólo desde un archivo local. Además, el archivo que se está leyendo debe estar en el mismo servidor que el programa que hace la petición AJAX.

los carga() mecanismo descrito aquí es adecuado para una situación básica en la que desea cargar un texto o código de código HTML en sus páginas.

La construcción de la CMS de un hombre pobre con AJAX

AJAX y jQuery puede ser una manera muy útil para construir sitios web eficaces, incluso sin necesidad de programación del lado del servidor. Con frecuencia, un sitio web se basa en una serie de elementos más pequeños que se pueden intercambiar y reutilizar. Puede utilizar AJAX para construir un marco que permite una fácil reutilización y modificación del contenido de la web.

Aunque nada es todo lo que impactante sobre la página desde la perspectiva del usuario, un vistazo al código puede mostrar algunas sorpresas:

La página no tiene contenido! Todos los divs están vacíos. Ninguno de los detalles de la captura de pantalla está presente en este documento, pero todos se extrae de archivos más pequeños de forma dinámica.
La página consta de divs llamados vacíos. En lugar de cualquier contenido particular, la página consiste en variables con ID.
Utiliza jQuery. La librería jQuery se utiliza para simplificar enormemente la carga de datos a través de llamadas AJAX.
Todo el contenido está en archivos separados. Mira a través del directorio, y se puede ver archivos HTML muy simples que contienen pequeñas partes de la página. Por ejemplo, story1.html se ve así:
Libro I - Creación de la Fundación HTML
Fundamentos de sonido HTML
Sólo se trata de Validación
La elección de sus herramientas
Gestión de la información con Listas y Tablas
Cómo realizar las conexiones con los enlaces
Adición de Imágenes
Creación de formularios
los en eso() método se ejecuta en document.ready. Cuando el documento está listo, la página se ejecuta el en eso()método.
los en eso() método utiliza llamadas AJAX para cargar dinámicamente contenido. No es nada más que una serie de jQuery carga() métodos.
Este enfoque puede parecer mucho trabajo, pero tiene algunas características muy interesantes:
Si usted está construyendo un sitio grande con varias páginas, normalmente se quiere diseñar el aspecto visual de una vez y volver a utilizar la misma plantilla en general en varias ocasiones.
Además, es probable que tenga algunos elementos que serán consistentes en varias páginas. Usted puede simplemente crear un documento predeterminado y copiar y pegar para cada página, pero este enfoque se complica. ¿Qué ocurre si se han creado 100 páginas de acuerdo a una plantilla y luego tenga que cambiar la cabecera? Es necesario hacer el cambio en 100 páginas diferentes.
La ventaja del enfoque de estilo plantilla es la reutilización de código. Al igual que el uso de un estilo externa le permite multiplicar una hoja de estilo a través de cientos de documentos, el diseño de una plantilla sin contenido le permite almacenar fragmentos de código en archivos más pequeños y volver a utilizarlos. Todas las 100 páginas apuntan al mismo archivo de menú, así que si desea cambiar el menú, cambiar un archivo y todo cambia con él.
He aquí cómo se utiliza este tipo de enfoque:
Crear un modelo único para todo el sitio.
Construir básica en HTML y CSS para gestionar el aspecto general de todo el sitio. No se preocupe por el contenido todavía. Sólo construir marcadores de posición para todos los componentes de su página. Asegúrese de darle a cada elemento de un ID y escribir el CSS para hacer las cosas posicionado como desee.
Añadir soporte jQuery.
Hacer un vínculo a la biblioteca jQuery, y hacer un defecto en eso()método. Poner en código para manejar poblar aquellas partes de la página que siempre va a ser coherente.
Duplicar la plantilla.
Una vez que tenga una idea de cómo va a funcionar la plantilla, haga una copia para cada página de su sitio.
Personalizar cada página cambiando la en eso() función.
La única parte de la plantilla que cambia es el en eso()función. Todas las páginas serán idénticos, excepto que han personalizado en eso()funciones que cargan contenido diferente.
contenido personalizado de carga en el divs con AJAX.
Utilizar el en eso()función para cargar contenido en cada div.
Esta es una gran manera de gestionar el contenido, pero no es del todo un sistema en toda regla de gestión de contenido. Incluso AJAX no puede bastante permitirá almacenar contenido en la web. sistemas de gestión de contenidos más complejos también utilizan bases de datos en lugar de archivos para manejar el contenido. Usted necesitará algún tipo de programación del lado del servidor (como PHP) y por lo general una base de datos (como MySQL) para manejar este tipo de trabajo.