Skodev
Belajar coding dalam bahasa Indonesia
DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja
Skodev
Belajar coding dalam bahasa Indonesia
Tutorial ringkas dan mudah mengenai Document Object dalam JavaScript. Pahami fungsi dan cara kerja tentang Document Object di sini.
Dalam JavaScript, istilah Document merujuk pada objek yang mewakili halaman web dan berisi properti dan metode untuk bekerja dengan elemen halaman tersebut. Objek ini dikenal dengan nama Document Object. Dalam tutorial ini, kita akan memahami lebih detail mengenai Document Object dan cara kerjanya.
Document Object adalah sebuah antarmuka pemrograman aplikasi (API) untuk berinteraksi dengan halaman web. Sebagai bagian dari objek window, Document Object digunakan untuk membuat, membaca, mengubah, dan menghapus elemen-elemen pada halaman HTML. Istilah ini sering digunakan ketika membahas konsep seperti DOM (Document Object Model), yang memodelkan struktur halaman web dan memungkinkannya diubah dengan JavaScript.
Objek Document merupakan bagian integral dari model objek dokumen (DOM), yang memungkinkan manipulasi konten halaman web menggunakan JavaScript. Contoh sederhana dari penggunaan Document Object adalah ketika kamu ingin mengubah teks di dalam elemen Paragraph (<p>) di halaman HTML. Berikut adalah contoh penggunaannya:
document.body.innerHTML = '<p>Halo, dunia!</p>';Dalam contoh di atas, document adalah referensi ke objek Document, body adalah metode yang meminta elemen <body> dari halaman, dan innerHTML digunakan untuk mengatur atau mendapatkan konten HTML dari elemen yang ditentukan.
Ada banyak metode dan properti yang bisa kamu gunakan dengan Document Object. Beberapa dari mereka adalah:
Untuk mendapatkan elemen dari halaman, kamu bisa menggunakan metode seperti getElementById(), getElementsByClassName(), dan getElementsByTagName(). Misalnya:
let elem = document.getElementById('myId');Kamu bisa mengubah konten elemen dengan menggunakan properti innerHTML seperti dijelaskan di atas.
Kamu bisa menambahkan elemen baru ke halaman dengan menggunakan metode createElement() dan appendChild(). Untuk menghapus elemen, kamu bisa menggunakan metode removeChild().
let newNode = document.createElement('p');
newNode.innerHTML = 'Ini adalah paragraf baru.';
document.body.appendChild(newNode);