aplikasi XML

aplikasi XML

Bab ini mendemonstrasikan beberapa aplikasi XML kecil yang dibangun di atas XML, HTML, XML DOM, dan JavaScript.

Contoh dokumen XML

Pada aplikasi ini kita akan menggunakan file "cd_catalog.xml".

Tampilkan CD pertama dalam elemen div HTML

Contoh berikut mengambil data XML dari elemen CD pertama dan kemudian menampilkan data dalam elemen HTML dengan id="showCD". Fungsi displayCD() dipanggil saat halaman dimuat:

Contoh

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

tampilan fungsiCD()
{
artis=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
tahun=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artis: " + artis + "<br />Judul: " + judul + "<br />Tahun: "+ tahun;
dokumen.getElementById("showCD").innerHTML=txt;
}

Cobalah »

Tambahkan skrip navigasi

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

Contoh

 fungsi selanjutnya()
{ // menampilkan CD berikutnya, kecuali Anda menggunakan CD terakhir
jika (i<x.panjang-1)
{
saya++;
tampilanCD();
}
}

fungsi sebelumnya()
{ // menampilkan CD sebelumnya, kecuali Anda menggunakan CD pertama
jika (saya>0)
{
Saya--;
tampilanCD();
}
}

Cobalah »

Menampilkan informasi album saat mengklik CD

Contoh terakhir menunjukkan cara menampilkan informasi album ketika pengguna mengklik item CD:

Cobalah.

Untuk mempelajari lebih lanjut tentang penggunaan JavaScript dan XML DOM, kunjungi tutorial XML DOM kami.