Cách thức hoạt động của <script defer="defer"> trong HTML?

Thuộc tính defer được dùng để chỉ định rằng script sẽ được thực thi khi trang đã tải xong (khi HTML đã được parse hoàn toàn). Nó chỉ áp dụng cho script bên ngoài (external scripts) và là một boolean attribute (chỉ cần có mặt là bật, không cần giá trị).

Ví dụ

<!DOCTYPE html>
<html>
<body>
    <script src="defer_test.js" defer></script>
    <p>File JS bên ngoài sẽ tải sau, vì chúng ta dùng defer</p>
</body>
</html>

Điểm quan trọng về defer:

• Script được tải song song (parallel) với việc parse HTML.
• Script chỉ chạy sau khi HTML parse xong, nhưng trước sự kiện DOMContentLoaded.
• Các script có defer sẽ thực thi theo thứ tự xuất hiện trong tài liệu.
• Chỉ hoạt động với script external (có thuộc tính src).

So sánh nhanh: async tải và chạy ngay khi xong (không đảm bảo thứ tự), defer tải song song nhưng chạy sau khi HTML xong (đảm bảo thứ tự).