2011-01-01 34 views
5

Gần đây tôi đã nhận thấy rằng một số (không phải tất cả) các tập lệnh javascript và jQuery của tôi sẽ không hoạt động trừ khi tôi đặt liên kết cho tệp .js gần phía dưới cùng của trang thay vì khu vực đầu nơi tôi đặt liên kết cho tệp .css.Tôi nên đặt liên kết tới các tệp Javascript/jQuery trong tệp html của mình ở đâu?

Từ những gì tôi hiểu, javascript có thể đi ở một trong hai địa điểm và bạn không được đặt trong tiêu đề vì nó cũng làm chậm quá trình tải trang. Đồng thời, nếu tôi đặt nó trong thẻ body của tệp html, có vẻ hơi lộn xộn và tự hỏi thực hành tốt nhất là gì để đặt các tệp .js ở một nơi rõ ràng. Tôi có nên đặt nó ở góc dưới bên phải trước thẻ body kết thúc không? Các nhà phát triển web chuyên nghiệp xử lý việc này như thế nào?

Trả lời

3

Nếu tập lệnh của bạn không hoạt động trừ khi bạn đặt chúng về phía dưới thì bạn có thể bắt đầu thao tác DOM khi DOM chưa sẵn sàng (hoặc có thể bạn đã sử dụng document.write, nhưng tôi nghi ngờ rằng đây là trường hợp). Để giải quyết vấn đề này, bạn chỉ cần bắt đầu xử lý khi DOM đã sẵn sàng. Với jQuery bạn sẽ cần một cái gì đó như:

$(function() { 
    // DOM is ready here and you can safely manipulate it 
}); 

Về cách vị trí của các kịch bản ảnh hưởng đến hiệu suất Tôi đề nghị bạn đọc những 3 bài viết từ guru thực hiện phía khách hàng:

Tải không đồng bộthực thi chậm là các chủ đề rất nóng ngay bây giờ. Chúng cho phép bạn xác định rõ ràng mọi thứ tại <head> nhưng rất cụ thể về cách chúng được tải và khi chúng bị bắt.

+0

nhờ, mã bạn đã cho tôi để cho các công việc mã jQuery trong khi vẫn đang được đặt ở phía trên. Và cảm ơn sự thấu hiểu về việc tải DOM, đó chỉ là những gì tôi cần hiểu. –

+0

Cú pháp tôi đưa cho bạn có thể trông ngoài hành tinh, nhưng nó chỉ là viết tắt của tự giải thích '$ (tài liệu) .ready (function() {...});' – cherouvim

Các vấn đề liên quan