Aplikasi XML

Bab ini menunjukkan beberapa aplikasi XML kecil yang dibina pada XML, HTML, XML DOM dan JavaScript.

Contoh Dokumen XML

Dalam aplikasi ini, kami akan menggunakan fail "cd_catalog.xml".

Tunjukkan CD pertama dalam elemen div HTML

Contoh berikut mendapat data XML daripada elemen CD pertama dan kemudian memaparkannya dalam elemen HTML dengan id="showCD" Paparkan data. Fungsi displayCD() dipanggil apabila halaman dimuatkan:

x=xmlDoc.getElementsByTagName("CD");
i=0;

function displayCD()
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
document.getElementById("showCD").innerHTML=txt;
}

Untuk menambah navigasi (fungsi) pada contoh di atas, next() perlu dibuat dan previous() dua fungsi:

function next()
{ // display the next CD, unless you are on the last CD
if (i<x.length-1)
{
i++;
displayCD();
}
}

function previous()
{ // displays the previous CD, unless you are on the first CD 
if (i>0)
{
i--;
displayCD();
}
}

Paparkan maklumat album apabila mengklik CD

Contoh terakhir menunjukkan cara memaparkan maklumat album apabila pengguna mengklik pada item CD:

Cubalah.

Untuk mengetahui lebih lanjut tentang menggunakan JavaScript dan DOM XML, lawati tutorial DOM XML kami.