Apa Itu Document Object Model/DOM?

Pengertian Document Object Model Atau DOM

Document object model, HTML, XML, XTHML documentDOM adalah programming interface untuk dokumen HTML dan XML. DOM dikembangkan oleh W3C ( World Wide Web Consortium) dan dijadikan standar untuk mengakses dokumen HTML dan XML. Dengan adanya DOM, program dan skrip bisa memanipulasi struktur, gaya dan konten dari dokumen, kira-kira begitulah pengertian Document Object Model atau DOM.

Halaman web tersendiri adalah sebuah dokumen. Dokumen ini bisa ditampilkan dalam web browser atau dilihat dalam source HTMLnya. Disini DOM berfungsi sebagai merepresentasikan dokumen tersebut ke dalam bentuk Object-oriented sehingga dapat dirubah oleh bahasa skrip. Bahasa skrip antara lain seperti Javascript(contoh library JQuery), Python, Ruby, PHP dll.

DOM & Javascript

DOM bukanlah sebuah bahasa pemrograman, namun tanpanya javascript tidak akan mengerti struktur atau bentuk dari halaman web. Halaman web yang dimaksud adalah dokumen HTML dan XML beserta komponen-komponennya (elemen-elemen web). Elemen web seperti header, tables, text dll. adalah bagian dari dokumen yang bisa diakses dan dimanipulasi menggunakan DOM dan Javascript.

Pada awalnya DOM dan Javascript sangat berkaitan antara satu dan lainnya. Namun seiring dengan waktu keduanya menjadi terpisah dan menjadi kesatuan yang berbeda. Konten halaman disimpan didalam DOM dan dapat dimanipulasi oleh Javascript. Oleh karena itu kita bisa menulis persamaan ini :

Halaman web = DOM + Javascript (bahasa skrip)

Berikut adalah beberapa hal yang bisa dilakukan oleh Javascript terhadap HTML melalui DOM :

  • JS mampu merubah semua elemen HTML didalam halaman web.
  • Merubah atribut HTML dalam halaman web.
  • Merubah style CSS pada halaman web.
  • Menambah atau menghapus atribut maupun elemen HTML.

Cara Mengakses DOM

Sebenarnya untuk mengakses DOM tidak ada cara yang terlalu spesifik. Setiap browser masa kini pasti memiliki DOM yang dimplementasikan didalamnya. Meskipun implementasinya berbeda-beda di setiap browser, namun semua web browser pasti menggunakan DOM dengan standar yang sama agar dapat diakses dan dimanipulasi oleh Javascript(bahasa skrip).

Berikut adalah beberapa fungsi untuk mengakses DOM dan elemen/komponen yang ada didalamnya :

  • document.getElementById
  • document.getElementsByName
  • document.getElementsByClassName, dll.
Web Hosting Murah

One thought on “Apa Itu Document Object Model/DOM?”

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *