Como fazer um pedido de AJAX com jQuery para HTML5 e CSS3 Programação

O objetivo principal de uma biblioteca AJAX como jQuery é simplificar solicitações de AJAX para programadores HTML5 e CSS3. É difícil de acreditar o quão fácil isso pode ser com jQuery.

Como incluir um arquivo de texto com AJAX

Confira este código limpo:

O HTML é muito limpo. Ele simplesmente cria uma div vazia chamada saída.

Este exemplo usa AJAX, por isso, se ele não está funcionando, você pode precisar de se lembrar alguns detalhes sobre como AJAX funciona. Um programa usando AJAX deve ser executado através de um servidor web, não apenas de um arquivo local. Além disso, o que está sendo lido arquivo deve estar no mesmo servidor como o programa que faz a solicitação AJAX.

o carga() mecanismo aqui descrito é adequado para uma situação básica onde você quer carregar um texto simples ou trecho de código HTML em suas páginas.

Construindo CMS de um homem pobre com AJAX

AJAX e jQuery pode ser uma maneira muito útil para construir sites eficientes, mesmo sem programação do lado do servidor. Frequentemente um site é baseado em uma série de elementos menores que podem ser trocados e reutilizados. Você pode usar AJAX para construir uma estrutura que permite uma fácil reutilização e modificação do conteúdo da web.

Embora nada é tudo o que chocante sobre a página a partir da perspectiva do usuário, um olhar para o código pode mostrar algumas surpresas:

 
A página não tem conteúdo! Todos os divs estão vazios. Nenhum de o texto mostrado na captura de tela está presente neste documento, mas todos são extraídos de arquivos menores dinamicamente.
A página consiste de vazios divs nomeados. Ao invés de qualquer conteúdo particular, a página é constituída por espaços com IDs.
Ele usa jQuery. A biblioteca jQuery é usado para simplificar muito o carregamento de dados através de chamadas de AJAX.
Todos os conteúdos estão em arquivos separados. Olhe através do repertório, e você pode ver arquivos HTML muito simples que contêm pequenas partes da página. Por exemplo, story1.html parece com isso:
Livro I - Criação da Fundação HTML 
Fundações HTML som
É toda sobre Validação
Escolhendo suas Ferramentas
Gestão da Informação com listas e tabelas
Fazendo conexões com links
adicionando imagens
Criação de formulários
o nisso() método é executado em document.ready. Quando o documento está pronto, a página corre o nisso()método.
o nisso() método usa chamadas de AJAX para carregar dinamicamente o conteúdo. É nada mais do que uma série de jQuery carga() métodos.
Esta abordagem pode parecer um monte de trabalho, mas tem algumas características muito interessantes:
Se você está construindo um grande site com várias páginas, você geralmente deseja criar a aparência visual uma vez e reutilizar o mesmo modelo geral repetidamente.
Além disso, você provavelmente vai ter alguns elementos que serão consistentes ao longo de várias páginas. Você poderia simplesmente criar um documento padrão e copiar e colá-lo para cada página, mas esta abordagem fica confuso. O que acontece se você tiver criado 100 páginas de acordo com um modelo e, em seguida, precisará alterar o cabeçalho? Você precisa fazer a mudança em 100 páginas diferentes.
A vantagem da abordagem de estilo do modelo é a reutilização de código. Assim como o uso de um estilo externo permite multiplicar uma folha de estilo em centenas de documentos, a concepção de um modelo sem conteúdo permite armazenar trechos de código em arquivos menores e reutilizá-los. Todos os 100 páginas apontam para o mesmo arquivo de menu, por isso, se você quiser mudar o menu, alterar um arquivo e tudo muda com ele.
Aqui está como você usa esse tipo de abordagem:
Criar um único modelo para todo o seu site.
Criar HTML básico e CSS para controlar a aparência geral e sentir todo o seu site. Não se preocupe com o conteúdo ainda. Basta construir espaços reservados para todos os componentes da sua página. Certifique-se de dar a cada elemento de um ID e escrever o CSS para fazer as coisas posicionado como você quer.
Adicionar suporte jQuery.
Faça um link para a biblioteca jQuery, e fazer um padrão nisso()método. Coloque em código para lidar preencher as partes da página que será sempre consistente.
Duplicar o modelo.
Depois de ter uma noção de como o modelo vai funcionar, faça uma cópia para cada página do seu site.
Personalizar cada página, alterando a nisso() função.
A única parte do molde que muda é a nisso()função. Todas as suas páginas serão idênticos, a não ser que tenha personalizado nisso()funções que carregam conteúdo diferente.
conteúdo personalizado de carga na divs com AJAX.
Use o nisso()função para carregar conteúdo em cada div.
Esta é uma ótima maneira de gerenciar o conteúdo, mas não é completamente um sistema de gestão de conteúdo full-blown. Mesmo AJAX não consegue permitir que você loja conteúdo na web. Mais complexos sistemas de gerenciamento de conteúdo também usar bancos de dados em vez de arquivos para controlar o conteúdo. Você vai precisar de algum tipo de programação do lado do servidor (como PHP) e, geralmente, um banco de dados (como o MySQL) para lidar com este tipo de trabalho.