Apa itu HTML DOM? XML DOM?

31 Oktober 2009 6 Komentar

Intermezzo :

tadi pagi2, saya ikutan tes tulis kerja di suatu perusahaan terkenal berlabel internasional bernama PT. Labtech Penta Internatioanal! saya melamar jadi IT Programmer!

So, mulailah tes dari tes psikotes, terus tes Bhs. inggris dan terakhir sesuatu gak terduga Tes Keahlian! (Keahlian di bidang saya Programming) soal-soalnya bikin aku Enek! kenapa? soal kayak UAS waktu kuliah, dan susahnya berlipat2 dari UAS , muter otak kanan kiri aq cuman ngisi 5 Nomor (Ntah bener atau gak seng penting Ngisi) dari 12 pertanyaan, menariknya ada istilah baru yang belum saya baca sebelumnya dan Menarik untuk saya bahas!

HTML DOM dan XML DOM (what’s that?) setelah searching di google, istilah ini ada Dasar Web (kemana aja kuliah selama ini? <- LOL!)

Gak kata terlambat untuk Mengetahui Sesuatu….yang jelas sekarang aku ingin membahasnya di blogku ini!

saya mulai dengan Defini DOM itu sendiri!

Document Object Model (DOM) adalah object model standar untuk HTML dan XML yang bersifat platform independent. Sebuah web browser tidak harus menggunakan DOM untuk menampilkan dokumen HTML. Namun DOM diperlukan oleh JavaScript yang akan mengubah tampilan sebuah website secara dinamis. Dengan kata lain, DOM adalah cara JavaScript melihat suatu halaman HTML.

W3C mulai mengembangkan DOM pada awal 1990-an. Pada bulan Oktober 1998, DOM 1 diluncurkan. Spesifikasi DOM W3C terbagi menjadi beberapa tingkat. Sebuah halaman yang mendukung suatu level harus menerapkan semua persyaratan level tersebut dan di bawahnya.

Sebelum ada standar DOM dari W3C, masing-masing web browser memiliki DOM sendiri. Akibatnya, bila suatu website ingin ditampilkan secara cross-browser compatible, ia harus dirancang untuk setiap web browser yang akan didukung. DOM standar mempermudah pengembangan aplikasi web.

Coba kita Lihat Struktur Hierarkinya…

aku pun masih gak donk dengan Struktur Hirarki ini, oke deh saya ambil dari Sumber lain

DOM dibagi dalam 3 Level :

  1. Core DOM, Model Standar untuk Dokumen terstruktur.
  2. HTML DOM, Model Standar untuk Dokumen HTML.
  3. XML DOM, Model Standar untuk Doukumen XML.

1. HTML DOM

  • Model Objek Standar untuk HTML
  • Standar Interface programming untuk HTML
  • Platform dan Bahasa Bebas/independent
  • Standard W3C

Definisi : objek dan properti dari semua elemen HTML dan ada mehod2 untuk mengakses semua elemen tersebut.

Bagan HTML DOM :

Objek HTML DOM!

  • Document object
  • Anchor object
  • Area object
  • Base object
  • Body object
  • Button object
  • Event object
  • Form object
  • Frame object
  • Frameset object
  • IFrame object
  • Image object
  • Input Button object
  • Input Checkbox object
  • Input File object
  • Input Hidden object
  • Input Password object
  • Input Radio object
  • Input Reset object
  • Input Submit object
  • Input Text object
  • Link object
  • Meta object
  • Object object
  • Option object
  • Select object
  • Style object
  • Table object
  • TableCell object
  • TableRow object
  • Textarea object

2. XML DOM

Definisi : Sebuah standar untuk mengakses dan memanipulasi XML.

View dari Dokumen XML adalah seperti Struktur pohon.semua elemen dapat diakses melalui DOM tree. konten dari XML berupa teks dan atribut2 dapat dimodifikasi dan dihapus atau dapat dibuat elemen baru. Elemen2nya, Teks dan atribut dikenal dengan Node.

contoh untuk mendapatkan suatu teks dari <to> sebuah elemen :

xmlDoc.getElementsByTagName(“to”)[0].childNodes[0].nodeValue

  • xmlDoc – the XML document created by the parser.
  • getElementsByTagName(“to”)[0] – the first <to> element
  • childNodes[0] – the first child of the <to> element (the text node)
  • nodeValue – the value of the node (the text itself)

Untuk mengetahui secara pasti coba aja skrip ini :

<html>
<body>
<h1>W3Schools Internal Note</h1>
<p><b>To:</b> <span id=”to”></span><br />
<b>From:</b> <span id=”from”></span><br />
<b>Message:</b> <span id=”message”></span>

<script type=”text/javascript”>
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest()
}
else
{
xhttp=new ActiveXObject(“Microsoft.XMLHTTP”)
}
xhttp.open(“GET”,”note.xml”,false);
xhttp.send(“”);
xmlDoc=xhttp.responseXML;

document.getElementById(“to”).innerHTML=
xmlDoc.getElementsByTagName(“to”)[0].childNodes[0].nodeValue;
document.getElementById(“from”).innerHTML=
xmlDoc.getElementsByTagName(“from”)[0].childNodes[0].nodeValue;
document.getElementById(“message”).innerHTML=
xmlDoc.getElementsByTagName(“body”)[0].childNodes[0].nodeValue;
</script>

</body>
</html>

seharusnya saya menjawab seperti ini waktu tes tulis tadi…hehehehe!
kurang lebihnya sperti itu! Mohon petunjukny bila ada yang kurang (masih belajar!)

Reference :
http://id.wikipedia.org/wiki/Document_Object_Model
http://www.w3schools.com

| My Distro : Unique 3 >> | Kaos #indonesiaUnite for Gempa Only 45rb >> |

Disimpan dalam Info Wacana IT Tagged with , , , ,