Bagian 13: Manipulasi DOM dengan JavaScript

Pada bagian ini, kamu akan mempelajari bagaimana JavaScript dapat digunakan untuk memanipulasi halaman web secara dinamis melalui DOM (Document Object Model). Ini adalah dasar penting untuk membuat situs web interaktif.

Apa itu DOM?

DOM (Document Object Model) adalah representasi struktur dokumen HTML dalam bentuk objek yang bisa dimanipulasi menggunakan JavaScript. Dengan DOM, kita bisa mengubah isi, struktur, dan gaya halaman web secara dinamis.

Catatan: DOM memungkinkan interaksi dinamis tanpa perlu reload halaman.
Sponsored

Memilih Elemen DOM

Kita dapat memilih elemen menggunakan metode seperti:

Contoh Manipulasi DOM

Kode JavaScript berikut akan mengubah teks dalam sebuah paragraf ketika tombol diklik.

Simulasi Manipulasi DOM

Ubah teks paragraf di bawah ini dengan mengklik tombol.

Di bagian berikutnya, kita akan membahas event handling di JavaScript.

Jika kamu sudah memahami cara kerja DOM, di bagian berikutnya kita akan melanjutkan dengan event handling agar elemen di halaman dapat merespons aksi pengguna.

๐Ÿ’ฌ Buat Website Paket website LPK