Đề bài: Bảng theo dõi tiến độ học ngoại ngữ

Xây dựng lại danh sách kỹ năng dưới dạng thẻ card, đáp ứng đủ các yêu cầu sau:

1. Mỗi mục hiển thị dưới dạng 1 thẻ card có nhiều thông tin (tiêu đề, mô tả, trạng thái); dữ liệu nguồn là 1 mảng các object trong JavaScript.
2. Dùng innerHTML để dựng cấu trúc HTML của card, và textContent cho các phần chỉ hiển thị chữ thuần; kèm comment giải thích vì sao chọn từng cách.
3. Dùng classList để phân loại trạng thái các mục (ví dụ: Chưa bắt đầu / Đang thực hiện / Hoàn thành) bằng các class CSS tự thiết kế.
4. Dùng thuộc tính style để thay đổi trực tiếp ít nhất 2 thuộc tính CSS cho các mục được đánh dấu ưu tiên; kèm comment so sánh với cách dùng classList.
5. Bổ sung chế độ giao diện sáng và tối bằng cách thêm/bớt class ở phần tử gốc (thẻ body) khi bấm nút chuyển chế độ.

Kết quả mong đợi tương tự hình minh họa dưới đây (xem file dapan.html để đối chiếu chi tiết):

Ràng buộc cấu trúc riêng cho mã đề E

Article quy trình ba bước: Thêm một article mô tả quy trình ba bước bằng danh sách đánh số. Không thay ràng buộc này bằng cấu trúc của mã đề khác.