Đề bài: Bài tập tại lớp - Buổi 7: JavaScript Event
Sản phẩm
Trang giới thiệu học phần, bổ sung các tương tác người dùng.
Yêu cầu
- Mỗi mục trong danh sách nội dung học phần có nút "Xem chi tiết", bấm vào thì mở đóng phần mô tả chi tiết của buổi học đó.
- Nút chuyển đổi giao diện sáng tối gắn ở header, hoạt động bằng sự kiện click kết hợp classList của buổi 6.
- Menu điều hướng dạng thu gọn: bấm nút menu thì mở đóng danh sách liên kết.
- Bổ sung hiệu ứng khi rê chuột vào thẻ nội dung bằng sự kiện mouseover và mouseout, so sánh với cách làm bằng pseudo-class hover ở buổi 3, viết comment nhận xét khi nào nên dùng CSS và khi nào cần JavaScript.
- Bổ sung ô tìm kiếm nội dung học phần, bắt sự kiện keydown để lọc hiển thị các mục khớp với từ khóa.
- Gắn tối thiểu 2 hàm xử lý khác nhau cho cùng 1 phần tử để minh họa ưu điểm của addEventListener.
Tiêu chí đánh giá
Các tương tác hoạt động ổn định, tách hàm xử lý rõ ràng, hiểu được luồng từ hành động người dùng tới mã chạy.
Kết quả mong đợi tương tự hình minh họa dưới đây: