Document Object Model (DOM) adalah pohon objek representasi halaman yang dapat dibaca dan diubah oleh JavaScript. Section ini membahas cara memilih elemen, membaca dan mengubah isinya, serta menyusun struktur baru dengan aman.

# Memahami DOM

Pohon objek representasi halaman, node, dan hubungannya dengan HTML.

Buka → # Selecting Elements

Memilih elemen dengan querySelector, querySelectorAll, dan getElementById.

Buka → # Traversing DOM

Bergerak antar elemen: parent, children, sibling, dan closest().

Buka → # Reading dan Changing Content

Membaca dan mengubah isi elemen dengan textContent, innerHTML, dan innerText.

Buka → # Attributes dan Properties

Atribut HTML, dataset data-*, dan properti yang merefleksikan atribut.

Buka → # classList

Mengelola class elemen dengan add, remove, toggle, replace, dan contains.

Buka → # Creating Elements

Membuat elemen dengan createElement, menempelkannya dengan append, prepend, dan insertBefore.

Buka → # Removing Elements

Menghapus elemen dengan remove, replaceWith, removeChild, dan pola innerHTML = ''.

Buka → # DOM Fragments

DocumentFragment untuk menyusun banyak elemen di luar pohon lalu menempelkannya sekali.

Buka → # Safe DOM Manipulation

Menyisipkan konten dinamis dengan aman: textContent, escapeHtml, dan batasan innerHTML.

Buka →