innerHTML

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

Property innerHTML menetapkan atau mengambil seluruh konten HTML (termasuk elemen anak) di dalam sebuah elemen. Ini berguna untuk memperbarui konten bagian halaman web secara dinamis.

element.innerHTML = "<b>Example Text !!</b>";

Tantangan

Mudah

Kamu diberi kode HTML yang berisi div dengan ID content .

Hanya dengan JavaScript, ubah konten elemen div ini:

Ambil elemen div menggunakan fungsi getElementById.
Atur konten HTML menjadi "<b>Updated Content</b>".

Coba sendiri

<!DOCTYPE html>
<html>
    <body>
        <div id="content">Original Content</div>
        <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 getElementsByClassName Telusuri dan Manipulasi getElementsByTagName querySelector

3Method DOM II

querySelectorAll addEventListenerinnerHTMLcreateElement and appendChild classList toggle

Latihan sendiri: Playground Web