Mengenal DOM HTML -->

Mengenal DOM HTML

Sorayakit
10 August 2018

DOM adalah sebuah aplikasi interface yang membantu merubah dan memodifikasi halaman website statis menjadi dinamis.

Di sadur dari w3school DOM adalah:

"Document Object Model (DOM) adalah platform dan antarmuka yang memungkinkan program dan skrip untuk mengakses dan memperbarui konten, struktur, dan gaya dokumen secara dinamis"

Sebuah website pada dasarnya berisi sebuah elemen elemen yang statis yang merupakan kerangka dasar pembentuk sebuah web. HTML yang terdiri dari elemen elemen statis ini yang akan diubah menjadi sebuah objek sehingga berisi properti. Dari properti ini kita bisa mengubah, manambah, memodifikasi sebuah value pada sebuah halaman website menjadi lebih dinamis menggunakan javascript.

 

Berikut ini adalah contoh sederhana mengenal DOM. Contoh ini pure kerangka HTML tanpa DOM. Dan setelah di buka di browser hanya menampilkan teks My First Page.


Berikut ini adalah kerangka HTML script dengan DOM


Kerangka HTML dengan dan tanpa DOM terlihat perbedaanya dari teks Hello world. Di Pure HTML tidak tampak adanya teks Hello world karena tidak adanya script untuk merubah element DOM dan tidak adanya elemen DOM yang dikenali untuk dirubah. Namun di HTML dengan DOM tampak sebuah element yang dikenal (id) dan bisa di rubah dengan metode document.getElementById.

Berikut ini yang bisa dilakukan dengan DOM:
  • Seperti mengganti HTML elements dihalaman web
  • mengganti semua HTML attributes dihalaman web
  • mengganti semua CSS styles dihalaman web
  • dapat membuang existing HTML element dan atribut
  • dapat menambah HTML elements baru dan atribut baru
  • dapat react to all existing HTML events dihalaman web
  • dapat membuat HTML events baruv dihalaman web

Demikian artikel singkat mengenal DOM semoga bermanfaat.. cmiiw


ref :https://www.w3schools.com