Telusuri dan Manipulasi

Pelajaran 6 dari 13 dalam kursus Metode DOM JavaScript di Coddy.

Ayo kerjakan tantangan!

Tantangan

Mudah

Kamu diberi kode HTML yang berisi lima paragraf dengan nama class item.

Hanya dengan JavaScript, ubah teks paragraf agar menjadi seperti daftar bernomor.

Berikut output yang diharapkan:

Jangan lupa muat ulang halaman web untuk melihat perubahan JS!

Coba sendiri

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <p class="item">Banana</p>
        <p class="item">Apple</p>
        <p class="item">Pear</p>
        <p class="item">Water</p>
        <p class="item">Milk</p>
        <script src="script.js"></script>
    </body>
</html>

Semua pelajaran di Metode DOM JavaScript

1Pengantar

Pengantar Document Object Model

2Metode DOM I

getElementById Ubah Gaya Elemen getElementsByClassNameTelusuri dan ManipulasigetElementsByTagName querySelector

3Method DOM II

querySelectorAll addEventListener innerHTML createElement and appendChild classList toggle

Latihan sendiri: Playground Web