AJAX pode ser usado para comunicar-se interativamente com arquivos XML.
O exemplo a seguir demonstrará como uma página web lê informações de um arquivo XML por meio de AJAX:
Quando o usuário seleciona um CD na lista suspensa acima, uma função chamada "showCD()" é executada. Esta função é acionada pelo evento "onchange":
<html><head><script>function showCD(str){ if (str=="") { document.getElementById("txtHint").innerHTML=""; return; Os navegadores IE7+, Firefox, Chrome, Opera, Safari executam xmlhttp=new XMLHttpRequest() } else { // IE6, IE5; O navegador executa xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint"). innerHTML=xmlhttp.responseText; xmlhttp.open("GET","getcd.php?q="+str,true); xmlhttp.send();}</script></head><body><form>Selecione um CD:<selecione o nome ="cds" onchange="showCD(this.value)"><option value="">Selecione um CD:</option><option value="Bob Dylan">Bob Dylan</option><option value=" Bonnie Tyler">Bonnie Tyler</option><option value="Dolly Parton">Dolly Parton</option></select></form><div id="txtHint"><b>As informações do CD serão listadas aqui...</ b></div></body></html>
A função showCD() executa as seguintes etapas:
Verifique se um CD está selecionado
Criar objeto XMLHttpRequest
Crie uma função que seja executada quando a resposta do servidor estiver pronta
Envie uma solicitação para um arquivo no servidor
Observe o parâmetro (q) adicionado ao final da URL (contendo o conteúdo da lista suspensa)
A página do servidor chamada acima através de JavaScript é um arquivo PHP chamado "getcd.php".
O script PHP carrega o documento XML, "cd_catalog.xml", executa a consulta no arquivo XML e retorna os resultados em HTML:
<?php$q=$_GET["q"];$xmlDoc = new DOMDocument();$xmlDoc->load("cd_catalog.xml");$x=$xmlDoc->getElementsByTagName('ARTIST');for ($i=0; $i<=$x->length-1; $i++){ // Nó do elemento de processo if ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y= ($x->item($i)->parentNode);for ($i=0;$i<$cd->length;$i++){ // Processar nó do elemento if ($cd->item($i)->nodeType==1) { echo("<b>" . $cd->item($i)->nodeName . ":</b > "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo("<br>"); }}?>
Quando a consulta do CD é enviada do JavaScript para a página PHP, o que acontece:
PHP cria objeto XML DOM
Encontre nomes em todos os elementos <artist> que correspondam aos dados passados pelo JavaScript
Produza as informações do álbum e envie de volta o espaço reservado "txtHint"