Cómo usar AJAX y jQuery para la inclusión del lado del cliente de su sitio HTML5 y CSS3

Cómo usar AJAX y jQuery para la inclusión de su HTML5 en el lado del cliente y CSS3 Site - Dummies

AJAX puede darle los mismos efectos para su HTML5 y CSS3 que el Server Side Includes (SSI). La página se verá exactamente igual, pero se usará un método completamente diferente para lograr su objetivo.

 csAJAX. html $ (documento). listo (función () {$ ("# encabezado"). carga ("encabezado. html"); $ ("menú #"). carga ("menú. html"); $ ("# contenido1") carga ( "story1. html"); $ ("# content2"). load ("story2. html"); $ ("# footer"). load ("footer. html");});  

El contenido de la página está vacío. Todos los contenidos están disponibles. Se utilizó una llamada jQuery AJAX para cargar cada archivo de texto en el elemento apropiado.

Aquí está el plan:

  1. Importar la biblioteca de jQuery.

    La biblioteca jQuery es, de lejos, la forma más fácil de trabajar con AJAX, así que importe jQuery en cualquier momento que desee trabajar con AJAX.

  2. Agregue una función de inicialización.

    Hay muchas formas de invocar funciones iniciales en jQuery. No importa qué mecanismo use siempre que ocurra después de que la página se haya cargado, pero antes que cualquier otro JavaScript.

  3. Cargue cada div con el método load ().

    La biblioteca jQuery tiene un método load () que le permite hacer una llamada AJAX y colocar el documento en el elemento indicado. Use este mecanismo en cada elemento de su página.

La misma estructura de documento se puede usar con contenido muy diferente cambiando el JavaScript. Si no puede crear un CMS completo (porque el servidor no permite SSI, por ejemplo) pero puede hacer AJAX, esta es una manera fácil de separar el contenido del diseño.