innerHTML

Bài học 11 trên 13 trong khóa học Các phương thức DOM trong JavaScript của Coddy.

Thuộc tính innerHTML dùng để đặt hoặc lấy toàn bộ nội dung HTML (bao gồm các phần tử con) bên trong một phần tử. Thuộc tính này hữu ích khi cần cập nhật nội dung của một phần trên trang web một cách linh hoạt.

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

Thử thách

Dễ

Bạn được cung cấp mã HTML có phần tử div với ID content .

Chỉ dùng JavaScript, hãy thay đổi nội dung của phần tử div này:

Lấy phần tử div bằng hàm getElementById.
Đặt nội dung HTML thành "<b>Updated Content</b>".

Tự làm thử

<!DOCTYPE html>
<html>
    <body>
        <div id="content">Original Content</div>
        <script src="script.js"></script>
    </body>
</html>

Tất cả bài học trong Các phương thức DOM trong JavaScript

1Giới thiệu

Giới thiệu Mô hình đối tượng tài liệu

2Phương thức DOM I

getElementById Chỉnh sửa kiểu dáng phần tử getElementsByClassName Duyệt qua và thao tác getElementsByTagName querySelector

3Các phương thức DOM II

querySelectorAll addEventListenerinnerHTMLcreateElement và appendChild Chuyển đổi classList

Tự luyện tập: Playground Web