Não gosto de escrever sobre isso, mas me sinto obrigado.
Eu pessoalmente evito ao máximo usar navegação por ajax, por uma série de problemas causados por isso.
AJAX é uma metodologia muito interessante, não é uma outra linguagem nova, é apenas um conceito que usa um objeto da
linguagem javascript.
Aqui, para facilitar o que quero expôr, já que esse artigo é apenas introdução para o próximo, vou utilizar o Framework jQuery, que também não é uma outra linguagem, é apenas, digamos assim uma ‘ferramenta’ escrita sob a
linguagem javascript.
index.html
Nossa index, contém todo o código jQuery que vamos precisar para carregar o conteúdo na nossa div#content.
Para usar a lib jQuery, preciso obrigatoriamente linkar no meu documento a declaração e definição dela, por isso a linha:
Agora sim, finalmente faço o ajax.
Usei o método .load(), para aproveitar a simplificidade dele. Veja que logo depois do arquivo (href), indico um ID para esse método.
Com isso, consigo ter páginas internas assim:
contato.html
Graças ao segundo parâmetro do .load(), o jQuery vai fazer um parser do .responseText, e vai jogar dentro do div#content da index.html, apenas o conteudo da div#content do contato.html.
fotos.html