AJAX XML

AJAX boleh digunakan untuk berkomunikasi secara interaktif dengan fail XML.

Contoh XML AJAX

Contoh berikut akan menunjukkan cara halaman web membaca maklumat daripada fail XML melalui AJAX:

Contoh

Pilih CD:                                                                                                                                                                                                             Cat Stevens                                                                                                                                                                                                                                                                                                                                                   -bawah senarai di atas, fungsi bernama "showCD()" dilaksanakan. Fungsi ini dicetuskan oleh acara "onchange":

   <html>
        <head>
        <script>
        function showCD(str)
        {
            if (str=="")
            {
                document.getElementById("txtHint").innerHTML="";
                return;
            }
            if (window.XMLHttpRequest)
            {
                // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行
                xmlhttp=new XMLHttpRequest();
            }
            else
            {
                // IE6, IE5 浏览器执行
                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>
        Select a CD:
        <select name="cds" onchange="showCD(this.value)">
        <option value="">Select a 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>CD info will be listed here...</b></div>
        </body>
     </html>

fungsi showCD() akan melaksanakan langkah berikut: 1) Semak sama ada CD dipilih

2) Cipta objek XMLHttpRequest 3) Cipta fungsi yang dilaksanakan apabila respons pelayan sedia

4) Hantar permintaan ke fail pada pelayan 5) Perhatikan parameter ditambahkan pada penghujung URL (q ) (Mengandungi kandungan senarai lungsur)

Nota:

Banyak pengetahuan JavaScript digunakan dalam contoh di atas ke bab ini dahulu: Tutorial JavaScript

Fail PHP

Halaman pelayan yang dipanggil di atas melalui JavaScript ialah fail PHP bernama "getcd.php" .

Skrip PHP memuatkan dokumen XML, "cd_catalog.xml", menjalankan pertanyaan terhadap fail XML dan mengembalikan hasil dalam 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++)
{
// 处理元素节点
if ($x->item($i)->nodeType==1)
{
if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
{
$y=($x->item($i)->parentNode);
}
}
}
$cd=($y->childNodes);
for ($i=0;$i<$cd->length;$i++)
{ 
// 处理元素节点
if ($cd->item($i)->nodeType==1)
{
echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
echo($cd->item($i)->childNodes->item(0)->nodeValue);
echo("<br>");
}
}
?>

Apabila pertanyaan CD dihantar ke halaman PHP daripada JavaScript Bila, ia akan berlaku:

1 PHP mencipta objek XML DOM

2. Cari semua nama dalam elemen <artis> data yang diluluskan oleh JavaScript

3 Keluarkan maklumat album dan hantar semula pemegang tempat "txtHint"

Ringkasan: Kembalikan format xml

Kelebihan:

XML ialah format data universal.

Daripada memaksa data ke dalam format yang ditentukan, sesuaikan teg yang sesuai untuk data tersebut.

Gunakan DOM untuk mengawal dokumen sepenuhnya.

Kelemahan:

Jika dokumen datang dari pelayan, anda mesti memastikan bahawa dokumen itu mengandungi maklumat pengepala yang betul. Jika jenis dokumen tidak betul, nilai responseXML akan kosong.

Apabila penyemak imbas menerima fail XML yang panjang, penghuraian DOM mungkin menjadi rumit.

Meneruskan pembelajaran
||
<?php //需要与前面的HTML文件联合使用 $q=$_GET["q"]; $xmlDoc = new DOMDocument(); $xmlDoc->load("cd_catalog.xml"); $x=$xmlDoc->getElementsByTagName('ARTIST'); for ($i=0; $i<=$x->length-1; $i++) { // 处理元素节点 if ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y=($x->item($i)->parentNode); } } } $cd=($y->childNodes); for ($i=0;$i<$cd->length;$i++) { // 处理元素节点 if ($cd->item($i)->nodeType==1) { echo("<b>" . $cd->item($i)->nodeName . ":</b> "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo("<br>"); } } ?>
  • Cadangan kursus
  • Muat turun perisian kursus