Hướng dẫn best place to put script tag in html - nơi tốt nhất để đặt thẻ script trong html

// my-script.js
document.addEventListener("DOMContentLoaded", function() {
    // this function runs when the DOM is ready, i.e. when the document has been parsed
    document.getElementById("user-greeting").textContent = "Welcome back, Bart";
});

không đồng bộ

Các tập lệnh với thuộc tính Async được thực thi không đồng bộ. Điều này có nghĩa là tập lệnh được thực thi ngay khi tải xuống, mà không chặn trình duyệt trong lúc này. Điều này ngụ ý rằng có thể tập lệnh 2 được tải xuống và thực thi trước tập lệnh 1.

Theo http://caniuse.com/#feat=script-async, 97,78% của tất cả các trình duyệt hỗ trợ điều này.

hoãn lại

Các tập lệnh với thuộc tính trì hoãn được thực thi theo thứ tự (nghĩa là tập lệnh đầu tiên 1, sau đó tập lệnh 2). Điều này cũng không chặn trình duyệt.

Không giống như các tập lệnh Async, các tập lệnh trì hoãn chỉ được thực thi sau khi toàn bộ tài liệu đã được tải.

Theo http://caniuse.com/#feat=script-defer, 97,79% của tất cả các trình duyệt hỗ trợ điều này. 98,06% hỗ trợ nó ít nhất một phần.

Một lưu ý quan trọng về khả năng tương thích của trình duyệt: Trong một số trường hợp, Internet & nbsp; Explorer 9 trở lên có thể thực hiện các tập lệnh được hoãn lại theo thứ tự. Nếu bạn cần hỗ trợ các trình duyệt đó, xin vui lòng đọc điều này trước!

.

Sự kết luận

Trạng thái hiện tại là đặt các tập lệnh vào thẻ

// my-script.js
document.addEventListener("DOMContentLoaded", function() {
    // this function runs when the DOM is ready, i.e. when the document has been parsed
    document.getElementById("user-greeting").textContent = "Welcome back, Bart";
});

// my-script.js
document.addEventListener("DOMContentLoaded", function() {
    // this function runs when the DOM is ready, i.e. when the document has been parsed
    document.getElementById("user-greeting").textContent = "Welcome back, Bart";
});