Latihan 1: DOM Advanced — JavaScript

Latihan 1 dari materi DOM Advanced di JavaScript — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.

Di HTML sudah ada <ul id="list"></ul> yang masih kosong, dan variabel list sudah menunjuk ke situ. Tambahkan tiga <li> ke dalamnya, masing-masing dibuat dengan document.createElement('li') lalu dimasukkan dengan list.appendChild(...):

<li> pertama bertuliskan Item 1
yang kedua Item 2
yang ketiga melanjutkan pola yang sama

Urutan appendChild menentukan urutan tampilnya.

Hint

Tiap item butuh tiga langkah: bikin elemennya, isi teksnya, lalu masukkan ke list. Ulangi untuk tiap item, urut dari yang pertama.
document.createElement('li') bikin elemennya, textContent mengisi teksnya, list.appendChild(li) memasukkannya. Loop for dari 1 sampai 3 bisa menghemat ketikan.
for (let i = 1; i <= 3; i++) { const li = document.createElement('li'); li.textContent = 'Item ' + i; list.appendChild(li) }

</> { } .css => #id fn()

Versi baru

HyperSheets

bagian dari BelajarWeb.dev

Membuka gerbang…

Latihan 1: DOM Advanced — JavaScript

Hint

Memperbarui Aplikasi