Lompat ke konten utama

JavaScript dari Nol

Pelajaran 19 dari 22

Menyentuh halaman (DOM) · Pelajaran 19

querySelector dan textContent

Tujuan: Pengguna dapat menulis fungsi yang mengisi teks sebuah elemen halaman.

±8 menitDiperiksa 2026-09-22

Di halaman web, objek document mewakili seluruh dokumen. Method document.querySelector mencari elemen pertama yang cocok dengan pemilih CSS, misalnya #hasil untuk id hasil atau .harga untuk kelas harga. Bila tidak ada yang cocok, hasilnya null.

Property textContent berisi seluruh teks di dalam elemen. Mengisinya mengganti isi elemen dengan teks apa adanya, tanpa menafsirkannya sebagai HTML.

const judul = document.querySelector("#judul");
judul.textContent = "Toko Nusantara";

const hasil = document.querySelector("#hasil");
hasil.textContent = `Total: Rp${(255000).toLocaleString("id-ID")}`;

Selesaikan latihannya dulu untuk menandai pelajaran ini selesai.

Lanjutkan ke

Sumber

Materi kelas ini diadaptasi dari Microsoft Web Dev for Beginners (2-js-basics, 4-typing-game, 7-bank-project) (MIT), Exercism — jalur JavaScript (MIT). Rincian perubahan ada di halaman kelas.