Além da fila de requisições, há algo mais que podemos fazer para otimizar nosso trabalho e que pode ser reaproveitado em vários projetos, que é escrever um método genérico para obter HTML do servidor (algo muito comum trabalhando com Ajax.)
Naturalmente você pode fazer mais do que isso com Ajax, então há espaço aberto para criar, por exemplo, uma função para executar javascript vindo do servidor e outra que preencha um select (e não consigo pensar em mais nada...)
Nossa idéia é ter uma função ajaxHTML, que recebe dois atributos: o id de um elemento HTML e assim:
function ajaxHTML(id,url){
//Obtém o objeto HTML
objetoHTML=document.getElementById(id)
//Exibe "Carregando..."
objetoHTML.innerHTML="<span class='carregando'>"+
"Carregando...</span>"
//Abre a conexão
xmlhttp.open("GET",url);
//Função para tratamento do retorno
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4){
//Mostra o HTML recebido
retorno=unescape(xmlhttp.responseText.replace(/\+/g," "))
objetoHTML.innerHTML=retorno
}
}
//Executa
xmlhttp.send(null)
}
Assim você pode chamar ajaxHTML("conteudo","funcoes.php?n=1") e a função vai se encarregar de exibir "Carregando..." no div "conteudo", fazer a requisição e atualizar o conteúdo do div quando receber o código. Isto segue aquela premissa do primeiro artigo de que usando a mesma função no servidor para o Ajax e para a aplicação sem javascript é muito mais fácil fazer sua aplicação degradar bonito (ou seja, funcionar bem sem javascript.)
Você vai notar que no funcoes.php, além da nova função de título, escrevemos apenas o trecho:
if(isset($_GET["h"])){
$t=titulo(intval($_GET["h"]));
echo(urlencode($t));
}
Ou seja, se passarmos o parâmetro h vamos ter como retorno o título da página. Você vai se lembrar que já havíamos construído o código, no primeiro artigo, para que ao receber o parâmetro n obtenhamos o conteúdo da página. Agora só falta a fila de conexões.