XML ~ Pemrograman dan Teknologi

Extensible Markup Language (XML) adalah bahasa markup yang mendefinisikan seperangkat aturan untuk mengubah teks dalam format tertentu agar bisa dibaca manusia dan juga dibaca oleh mesin. XML biasanya digunakan untuk menyimpan dan mengirim data dalam bentuk file teks. Spesifikasi XML 1.0 W3C dan beberapa spesifikasi terkait lainnya mendefinisikan tentang seperti apa XML. Desain XML ditujukan untuk menekankan kesederhanaan, umum, dan kegunaan di Internet.

Penulisan XML hampir sama dengan HTML, yaitu menggunakan tag yang diapit tanda kurang dari (<) dan lebih dari (>) dimana tiap tag bisa memiliki atribut tertentu.

Berikut ini adalah contoh dokumen XML.

<?xml version="1.0" encoding="UTF-8"?>
<Makanan>
    <Buah>
        <A warna="merah">Apel</A>
        <B>Stroberi</B>
    </Buah>
    <Sayur warna="hijau">
        <A>Kubis</A>
        <B>Bayam</B>
    </Sayur>
</Makanan>

Menggunakan Ajax untuk Membuka XML
Text XML bisa dibuka sebagai data dengan menggunakan javascript. Teks-nya bisa disimpan dalam file maupun string. Jika menggunakan file, kalian bisa membukanya dengan menggunakan AJAX dan properti responseXML. Jika kalian menggunakan string untuk menyimpan teks XML, kalian bisa menggunakan objek DOMParser dalam javascript. Misalnya, untuk membuka file XML yang isinya seperti di atas, gunakan script berikut ini.

var koneksi = new XMLHttpRequest();
koneksi.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var xmlku=this.responseXML;
        hasil=xmlku.getElementsByTagName("Buah")[0];
        for(var i=0;i<hasil.children.length;i++)alert(hasil.children[i].childNodes[0].nodeValue);
    }
};
koneksi.open("GET", "test.xml", true);
koneksi.send();

Dalam script atas, saya menganggap nama file XML-nya adalah "test.xml". Saya menggunakan asynchronous AJAX sehingga saya membutuhkan function. Jika kalian ingin menggunakan synchronous AJAX, ganti true dengan false dan hapus functionnya. Kalian bisa menggunakan properti responseXML di luar function jika yang kalian gunakan adalah synchronous AJAX.

Kalian bisa mengganti nama filenya jika kalian menggunakan file dengan nama lainnya. Untuk menggunakan AJAX, kalian harus membuka HTML-nya lewat website atau server lokal. Kalian juga bisa membukanya melalui file PHP jika mau. Jika kalian menggunakan apache atau XAMPP kalian bisa menempatkan scriptnya di file "index.php", "index.html" atau file lainnya di localhost (yang sudah berisi kode HTML).

Tag-tag XML diperlakukan seperti tag-tag HTML sehingga kalian bisa menggunakan getElementsByTagName dan getAttribute yang bisa kalian gunakan juga pada tag dalam HTML.

XML DOMParser
Selain membuka XML lewat file dengan AJAX di server, kalian juga bisa menyimpan teks XML dan membukanya dengan objek DOMParser. Contohnya kode HTML dan scriptnya bisa kalian lihat di bawah ini.
<!DOCTYPE html>

<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<H2>XML</H2>
<div id="hasil">
</div>
<script>
    var cnode;
    var teks="<Makanan>"+
        "<A warna='merah'>Apel</A>"+
        "<B>Stroberi</B>"+
        "<A>Kubis</A>"+
        "<B>Bayam</B>"+
    "</Makanan>";
    var parser = new DOMParser();
    var s="";
    xmlku=parser.parseFromString(teks, "text/xml");
    var hasil=xmlku.getElementsByTagName("Makanan")[0];
    for(var i=0;i<hasil.children.length;i++){
        cnode=hasil.children[i];
        s+=cnode.nodeName+":"+cnode.childNodes[0].nodeValue+"<br />";
    }
    document.getElementById("hasil").innerHTML=s;
</script>
</body>
</html>

Perhatikan contoh di atas!!!
Untuk mendapatkan nama tag dalam XML, kalian bisa menggunakan properti nodeName dari objek yang bisa didapat dengan method getElementsByTagName(). Isi dari tag bisa didapat dengan menggunakan "childNodes[0].nodeValue" jika di dalam tag tidak terdapat tag lain.

Dari sini, kalian bisa coba sendiri untuk bermain-main dengan XML. Selamat mencoba!?