DOM và sự kiện: tự kiểm tra và mở rộng

Đây là bài 5 của chương 4: DOM và sự kiện, thuộc khóa demo JavaScript. Nội dung được dùng để trải nghiệm cấu trúc chương trình học; hãy thực hành trên dữ liệu và môi trường thử nghiệm riêng. Trong dự án xuyên suốt, bạn sẽ xây dựng ứng dụng danh sách công việc có tìm kiếm, lọc và lưu trạng thái trên trình duyệt.

DOM là cây đối tượng biểu diễn tài liệu. Gắn sự kiện vào cha chung có thể xử lý các phần tử con được thêm sau này. Dữ liệu người dùng nên đưa vào textContent khi muốn hiển thị văn bản.

• Vì sao dom và sự kiện cần được xem xét riêng trong dự án JavaScript?
• Giải thích bằng lời của bạn: DOM là cây đối tượng biểu diễn tài liệu. Gắn sự kiện vào cha chung có thể xử lý các phần tử con được thêm sau này. Dữ liệu người dùng nên đưa vào textContent khi muốn hiển thị văn bản.
• Phát hiện vấn đề trong tình huống: Gắn listener sau mỗi lần render mà không dọn dẹp gây chạy lặp. Chèn đầu vào người dùng bằng innerHTML có thể tạo nguy cơ thực thi mã không mong muốn.
• Bạn sẽ giữ bằng chứng gì để chứng minh giải pháp hoạt động?

• Mục thêm mới nhận được sự kiện
• Mỗi click chỉ xử lý một lần
• Nội dung nhập hiển thị như văn bản

Bắt đầu từ yêu cầu Tạo danh sách có nút hoàn thành từng mục và thêm mục mới bằng form. Thay đổi quy mô, độ dài dữ liệu hoặc thứ tự thao tác. Chọn đúng một biến thể phù hợp với chương rồi dự đoán tác động trước khi thử. Ví dụ là công cụ để hiểu nguyên lý, không phải đáp án duy nhất.

• Mức 1: nhắc lại được khái niệm nhưng chưa tự thực hiện.
• Mức 2: tự hoàn thành ví dụ và giải thích các bước.
• Mức 3: xử lý được trường hợp biên và giải thích lựa chọn khác.

Nếu chưa đạt mức 2, quay lại bài thực hành thay vì chỉ đọc đáp án. Khi đã đạt mức 3, ghi lại một cách giải khác và so sánh độ đơn giản, khả năng kiểm chứng và giới hạn của hai phương án.

Tạo bảng gồm ca thử, đầu vào, kết quả mong đợi, kết quả thực tế và kết luận. Chỉ đánh dấu hoàn thành sau khi từng tiêu chí có kết quả quan sát được; bài tự kiểm tra này không tự chấm điểm và không cấp chứng chỉ.