O que é Ajax?
Ajax foi criado com o principio de ser uma maneira rápida e otimizada de podermos fazer requisições WEB, sendo esta totalmente transparente ao usuário.

Sabemos que todo o tipo de acesso a dados de um servidor de sites na internet, roda encima de requisições WEB(Requisições via Protocolo HTTP ao servidor de destino), e por resposta o servidor também com o mesmo protocolo retorna os dados solicitados, tais como HTML’s.

Este processo normalmente não é notado na visão do usuário, mas é isso que acontece quando digitamos em nosso navegador de internet um endereço da WEB.O ajax por sua vez também roda encima desta lógica.

Mas e afinal, para que usamos o Ajax?

Hoje esta tecnologia é utilizada para uma infinidade de processos, mas o que precisamos saber não é o que fazer com ele, mas sim saber como ele trabalha para podermos adequar tal tecnologia em nosso dia-a-dia.
Um Exemplo Básico da utilização de ajax, é um refresh de página, sem que o usuário necessite faze-lo.

O programador que cria a página, programa uma requisição ajax, para que busque novos dados no servidor em um limite de tempo, e então também por javascript, altera a visualização do usuário, talvez inserindo linhas em uma tabela ou algo do gênero, assim dando um aspecto de atualização automática.

Como Utilizar?

Hoje, o ajax é suportado pelos principais browsers disponíveis no mercado, e utilizados pela comunidade WEB.

Para isso utilizados objetos javascript, que rodam encima do browser do usuário e transitam dados por estas requisições.

Assim sendo, podemos fazer interações com processos de servidor, sem que seja necessário por exemplo recarregar a página do usuário, ou mesmo se quer visualize tal iteração.

Vejamos um exemplo básico.

//variavel ajax
var ajax = null;

//função que faz a requisição ajax
function requisicaoAjax(){
    //utilizado para requisições no browser Internet Explorer
    if (window.ActiveXObject) ajax = new ActiveXObject('Microsoft.XMLHTTP');
    //utilizado como o padrão javascript para requisições AJAX.
    else if (window.XMLHttpRequest) ajax = new XMLHttpRequest();
    //se a variável ajax for nula, logo o browser não suporta tal tecnologia
    if(ajax != null){
      //abre a requisição ajax, passando o método de acesso, a url solicitada e o parâmetro sobre sincronia
      ajax.open('GET','http://gujs.com.br/',false);
      //seta a funcao que sera chamada quando o ajax for retornado
      ajax.onreadystatechange = statusAjax;
      //inicia o tranporte
      ajax.send(null);
    }
}

//função que trata o retorno ajax
function statusAjax(){
  //caso o status do ajax esteja ok, então chama a função retornoAjax enviando o retorno da requisição como parâmetro
  if(ajax.readyState == 4 && ajax.status == 200){
    retornoAjax(ajax.responseText);
  }
}

//função que é chamada quando o ajax for retornado
function retornoAjax(response){
  //dá um alerta no texto de retorno
  alert(response);
}
requisicaoAjax();

1º) Criamos um objeto para o transporte do ajax;

2º) Setamos ao objeto as diretivas da solicitação como a url a ser solicitado e o método. O terceiro parâmetro é se deve ser assíncrono ou não, no caso estamos passando false, para o javascript aguardar o retorno da requisição.

3º) Indicamos qual será a função que ira fazer o tratamento de estados da requisição. (O status da requisição é retornado pelo browser para tratamento a cada vez que este status muda).
Você pode ver a listagem completa de status aqui: http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html

Quando dizemos

ajax.onreadystatechange = statusAjax;

Estamos indicando que toda a vez que este ajax mudar de status, ele deve chamar esta função.

No nosso caso, o único status interessante é o status de requisição ok.

Se a requisição retornar um status ok, então a partir daí trabalharemos em nosso refresh, como dito acima, onde trataríamos os dados retornados e aplicaríamos na visualização do usuário;

Uma coisa que devemos considerar e que por sua vez é de grande importância, é que não podemos fazer requisições Ajax a outro domínio diferente ao que o site atual roda.
Por exemplo:
Sendo que minha página exemplo_ajax.htm estivesse dentro de http://www.gujs.com.br/, só poderei fazer requisições ajax para arquivos que fiquem dentro de http://www.gujs.com.br/.

Este exemplo é bem simples, mas apenas para podermos ter uma noção de como funciona uma requisição ajax.

Existem hoje, várias bibliotecas javascript para formalizar tais requisições, bibliotecas que fazem o controle de estados inválidos da requisição, ou mesmo que facilitam o transporte de requisições via método POST.

O intuito deste artigo é simplesmente desmistificar este fênomeno chamado ajax.

Fique a vontade para deixarem comentários, ou entrar em contato ok?

Até a próxima pessoal;