DOM Manipulation Dasar di JavaScript
Penjelasan
DOM (Document Object Model) adalah representasi halaman HTML yang bisa diakses dan diubah lewat JavaScript. Dengan DOM API, JavaScript bisa memilih elemen (document.querySelector), mengubah isinya, dan merespons interaksi pengguna lewat event listener (addEventListener). Ini yang membedakan JavaScript dari bahasa lain di daftar ini — kode ini hanya jalan di dalam browser, bukan lewat Node.js.
Contoh Konsep
// Anggap ada <button id="tombolku">Klik</button> di HTML
const tombol = document.querySelector("#tombolku");
tombol.addEventListener("click", () => {
tombol.textContent = "Sudah diklik!";
});
// Mengubah style lewat JavaScript
tombol.style.color = "blue";
Praktikum
Bayangkan ada <p id="pesan">Halo</p> di HTML. Tulis kode yang memilih elemen itu dengan querySelector, lalu ubah textContent-nya jadi "Selamat belajar JavaScript!".
Ketik/edit bebas di sini untuk latihan — kode ini tidak dijalankan.
Tips
Kode yang mengakses document/window hanya bisa jalan di browser, bukan di Node.js polos — kalau kamu menguji kode DOM, jalankan lewat file HTML + browser, bukan lewat node app.js.