Thuộc tính defer và async trên thẻ <script> là gì?

{{FormatNumbertoThousand(model.total_like)}} lượt thích
499 lượt xem
Html/CSS middle

Thuộc tính defer/async có giá trị true/false (boolean).

Khi dùng defer, điều này quy định rằng script sẽ thực thi khi trang (page) đã hoàn tất việc phân tích cú pháp html (parsing).

Nếu cả hai thuộc tính đều không khai báo, tập lệnh được tải xuống và thực thi đồng bộ, đồng thời sẽ tạm dừng phân tích cú pháp tài liệu (document) cho đến khi nó thực thi xong (hành vi mặc định). Các tập lệnh được tải xuống và thực thi theo thứ tự mà chúng gặp phải.

+   Thuộc tính defer tải xuống tập lệnh trong khi tài liệu vẫn đang phân tích cú pháp nhưng đợi cho đến khi tài liệu hoàn tất quá trình phân tích cú pháp trước khi thực thi nó, tương đương với việc thực thi bên trong trình nghe sự kiện DOMContentLoaded, trì hoãn các tập lệnh sẽ thực thi theo thứ tự.

+   Thuộc tính async tải xuống tập lệnh trong khi phân tích cú pháp tài liệu nhưng sẽ tạm dừng trình phân tích cú pháp để thực thi tập lệnh trước khi nó hoàn tất quá trình phân tích cú pháp. các tập lệnh không đồng bộ sẽ không nhất thiết phải thực thi theo thứ tự.

Lưu ý: cả hai thuộc tính chỉ được sử dụng nếu tập lệnh có thuộc tính src (tức là không phải tập lệnh nội tuyến).

Ví dụ:

<script src="myscript.js"></script>
<script src="myscript.js" defer></script>
<script src="myscript.js" async></script>
{{login.error}}