ResponseXML
Além de texto simples e JSON, existe outra maneira (e muito eficiente) de trocar dados em Ajax. Essa maneira chama-se XML, e considero-a a melhor maneira para trocas de dados mais complexas, envolvendo várias partes de dados.
O XML
Bem, XML já devia ser algo conhecido para você. Não precisa saber muito, só como colocar as tags e o CDATA (esse outro eu explico).
Qualquer XML válido (sem nenhum erro de “ortografia”) pode ser usado, mas uma certa padronização ajuda. Eu costumo sempre usar o seguinte XML, para quase todos meus trabalhos mais recentes:
<?xml version="1.0" encoding="iso-8859-1"?>
<ajax-response>
<head></head>
<body></body>
<foot></foot>
<other></other>
</ajax-response>Esse é um código padrão que eu uso, sinta-se livre para mudá-lo. A tag head trará informações de cabeçalho (eu utilizo como <hN> ou mesmo no título da página). A tag foot trará informações de rodapé, mas nem sempre uso. A tag body traz tudo o que aparecerá na página, como todo mundo já usa. A tag other não costumo utilizar muito, apenas para trazer informações de script (arquivos a carregar, variáveis de funcionamento…). Dependendo de sua aplicação, você pode usar RSS, RDF, SOAP…
Como provavelmente incluiremos tags dentro dessas tags, que servirão para serem renderizadas, e não processadas, precisamos colocar elas dentro de uma seção CDATA. Ela faz com que o parser XML ignore tudo que estiver dentro. Use-a assim:
<body>![CDATA[
Aqui vão os dados
]]></body><Recomendo que você use isso em head, body, foot e other, para evitar futuras dores de cabeça.
O JavaScript
Para recuperarmos esse XML, fazemos a requisição normalmente e pedimos responseXML, ao invés de responseText: var xml = [XHR].responseXML;.
Lembra-se de DOM? Vamos utilizá-lo aqui para “pegar” o que está em nosso XML. Tudo seria mais fácil se o IE suportasse E4X (posso sonhar, não?)… Ele é bem parecido com o HTML DOM, mas não me venha usar innerHTML (não testado, mas pela lógica: HTML!) e getElementById (também não testado. Se der certo, alguém me avisa! funciona sim, como o Micox disse nos comentários).
No básico, usamos isso:
var body = decodeURIComponent(xml.getElementsByTagName('body')[0].firstChild.data);Tudo certo. Acabamos? Ainda não. No Firefox (não me pergunte por que), o CDATA é cortado a cada 4096 bytes (4Kb). Nesse caso, temos que pegar vários CDATA caso tenhamos mais de 4Kb. O código é esse:
for(var i=0; i < xml.getElementsByTagName('body')[0].childNodes.length; i++) body += decodeURIComponent(xml.getElementsByTagName('body')[0].childNodes[i].data); // Pegamos cada node e adicionamos na variavel
E pra que isso?
XML é muito usado em Web-services, por ser mais “padronizado” que texto (o SOAP é muito usado pra isso). Caso você queira um Leitor de RSS, é possível também. Um leitor de RDF, por que não? As utilidades são muitas.
O futuro (longínquo) da Web é XML. Seria bom que você aprendesse o “basicão” como eu. Além de ser legal, você verá que pode utiliza-lo em muitos lugares. E isso facilita e melhora o envio e recebimento de dados, dando a você muitas opções do que incluir ou não.
Update: o Bernardo fez um ótimo post sobre criar gráficos através de XML e Ajax. Lá tem mais umas vagas informações que não foram passadas aqui, leia lá!
muito bom,
mas eu não entendi o for, a sintaxe dele está correta?
abraços…
Bom artigo inicial Julio.
Sobre o getElementById: funciona sim, desde que o elemento tenha um ID. Afinal, o getElementById é uma função DOM e não algo relacionado exclusivamente ao HTML.
Micox: Valeu aí, vou editar.
Ramon: Não testei de maneira “decente”, mas no console do FF funcionou direitinho sem as chaves.
Muito Bom Júlio, já da pra ter idéia sobre o que é e como funciona. Valeu pelo link!
Ah! obrigado,
mas eu não estava falando das chaves, pois como o for só tem uma instrução não precisa delas, eu estava falando disso:
for(var i=0; i i++)
pelo o que eu sei, aquele i que está perdido lá no meio, é o que determina quantas vezes vai se repetir o for, e no caso a variavel i não está fazendo esse papel e também pelo que eu sei o for precisa de dois ponto-e-vírgula, a sintaxe é mais ou menos assim.
FOR (var inicia_variavel; teste_do_for; incrementa_variavel)
mas você disse que funcionou, então está bom.
abraços.
Ih!!! Foi deslize meu. Coloquei o sinal literalmente no texto, aí não apareceu. Eu estava vendo pelo fonte aqui, então não deu. Valeu pelo toque aí, Ramon!
Sensacional esse seu post Cara,
achei num forum enquanto procurava como pegar dados de capos Cdata..
Vlw mesmo cara
parabéns,
abss
Olá, como eu faço pra “mostrar” ao script o nome do meu xml?