Jika kalian memutuskan untuk belajar JavaScript maka sebelumnya kalian harus bisa memahami istilah DOM. Karena salah satu tugas utama Javascript di dalam web adalah membuat halaman web agar terlihat dinamis. Hal ini bisa dilakukan oleh Javascript dengan bantuan DOM.
Document Object Model (DOM) merupakan Application Programming Interface (API) untuk HTML, XML atau SVG. DOM memberikan kita jalan untuk mengakses dan manipulasi konten pada dokumen. Dengan DOM berkas HTML dapat dipresentasikan dalam bentuk objek yang dapat diakses oleh JavaScript.
Sebenarnya tidak hanya JavaScript tapi juga bisa diakses oleh bahasa pemrograman lain. Melalui DOM inilah JavaScript dapat memanipulasi elemen beserta atributnya pada HTML.
Struktur objek DOM digambarkan seperti struktur node tree (pohon simpul). Disebut pohon karena strukturnya seperti pohon. Pada kasus ini, induk tunggal batang merupakan elemen <html>, cabangnya merupakan anak element di dalamnya, daun adalah konten di dalam elemen tersebut.
Coba kita lihat contoh berikut:
<Document html> <html> <head> <title>DOM Structure</title> </head> <body> <h1>Hallo Developer!</h1> <p>Belajar Dasar pemrograman web</p> </body> </html>
Berdasarkan HTML di atas, maka objek DOM memiliki struktur seperti ini:
DOM terlihat seperti pemetaan dari sumber berkas HTML. Walaupun sama, berkas HTML dan DOM adalah hal yang berbeda.
Walaupun struktur dari DOM terbentuk berdasarkan berkas HTML, tetapi terdapat kasus tertentu yang menyebabkan struktur DOM berbeda dengan struktur HTML. Yakni kasus dimana kita terdapat kesalahan dalam menuliskan kode HTML.
Jadi itulah pengertian singkat mengenai istilah DOM yang harus kalian ketahui khususnya yang belajar JavaScript.
