Tutorial Aplikasi XML Terbaik Pada tahun 2024, Dalam tutorial ini Anda dapat mempelajari XML contoh dokumen,Menampilkan CD dalam elemen HTML div,contoh,Tambahkan script navigasi,contoh,Ketika Anda mengklik informasi album CD ditampilkan saat,

Aplikasi XML

Bab ini menunjukkan beberapa kecil berbasis XML aplikasi XML, HTML, DOM XML dan JavaScript dibangun.


XML contoh dokumen

Dalam aplikasi ini, kita akan menggunakan "cd_catalog.xml" berkas.


Menampilkan CD dalam elemen HTML div

Contoh berikut mendapatkan data XML dari elemen pertama dari CD, dan kemudian menampilkan data dalam id = "showCD" elemen HTML. displayCD () function dipanggil ketika beban halaman:

contoh

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;
}

Coba »


Tambahkan script navigasi

Untuk menambahkan navigasi (fungsi) untuk contoh di atas, kita perlu menciptakan berikutnya () dan sebelumnya () dua fungsi:

contoh

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();
}
}

Coba »


Ketika Anda mengklik informasi album CD ditampilkan saat

Contoh terakhir menunjukkan cara untuk menampilkan informasi album ketika pengguna mengklik pada sebuah proyek CD:

Coba .

Untuk informasi lebih lanjut tentang menggunakan JavaScript dan XML DOM, kunjungi XML DOM tutorial .


Aplikasi XML
10/30