Chúng tôi có một JQuery tuyên bố $(function() như:
<script type="text/javascript">
$(function(){
//Code..
})
</script>
câu hỏi Dumb - chính xác khi nào được thực hiện chức năng này? Có phải khi toàn bộ trang HTML đã được khách hàng tải xuống không?
lợi ích của việc sử dụng các gói mã trong vòng $(function() như trái ngược với chỉ đang làm gì:
<script type="text/javascript">
//Code..
</script>
Nó được thực thi ngay sau khi DOM được phân tích cú pháp và được gọi theo thứ tự xuất hiện nếu có nhiều lần xuất hiện. Tại thời điểm này, tài liệu tuy nhiên không được hiển thị, nó chỉ được phân tích cú pháp.
Tôi không chắc chắn đó là chính xác về tài liệu được phân tích cú pháp nhưng không được hiển thị. Tôi nghĩ rằng các trình duyệt thường hiển thị các phần tử khi chúng được phân tích cú pháp. Tôi có nhầm không? – user113716
@patrick dw: bạn thì không. Ngoài ra, bạn có thể đọc và thao tác dữ liệu kiểu và vị trí từ '$ .ready'; trình duyệt đã tính toán bố cục của trang tại điểm đó. – Tgr
Cấu trúc được phân tích cú pháp (có thể bao gồm tính toán bố cục) theo trình duyệt, nhưng giao diện người dùng chưa được vẽ, tức là hiển thị đối với người dùng .. nó là để theo dõi .. – Nrj
Khi tài liệu hoàn thành tải. Nó cũng giống như viết này:
$(document).ready(function(){});
EDIT: Để trả lời câu hỏi thứ hai của bạn:
Nếu bạn không quấn mã của bạn trong khối trên thì nó sẽ bắn ngay khi nó bắt gặp thay sau khi tất cả các điều khiển trên trang đã được tải. Vì vậy, nếu một khối ở trên cùng của một trang và nó đề cập đến các yếu tố trong trang những tài liệu tham khảo sẽ không hoạt động như các yếu tố chưa được tải.
Nhưng nếu bạn gói trong khối thì bạn biết rằng trang đã tải và tất cả các phần tử hiện có sẵn để tham khảo.
Nó thực sự xảy ra ** trước ** toàn bộ tài liệu đã được tải; chỉ khi DOM sẵn sàng. – VoteyDisciple
@Votey bạn nói đúng. Tôi cần phải có được rõ ràng hơn. Trong hầu hết các trường hợp thường không phải là một vấn đề nhưng có thể có những lúc mà đây là một sự khác biệt quan trọng. – spinon
Nó sẽ kích hoạt khi tài liệu được phân tích cú pháp và sẵn sàng, và tương đương với $(document).ready(function() { }).
Lợi ích rõ ràng là có thẻ tập lệnh của bạn trước các yếu tố khác trên trang có nghĩa là tập lệnh của bạn có thể tương tác với chúng ngay cả khi chúng không có sẵn ở thời gian phân tích cú pháp. Nếu bạn chạy tập lệnh của mình trước khi các phần tử được phân tích cú pháp và tài liệu chưa sẵn sàng, chúng sẽ không có sẵn để tương tác.
Nó kích hoạt sau khi tài liệu đã được nạp đầy đủ, cây DOM đã được khởi tạo, tất cả các kiểu CSS đã được áp dụng và tất cả Javascript đã được thực hiện. Nó khác với sự kiện load trong các phần tử đó (ngoài CSS/JS) tải nội dung của chúng từ các URL khác, chẳng hạn như hình ảnh hoặc tệp flash, không nhất thiết phải tải xong tại thời điểm này. Điều này thường được gọi là sự kiện "domready" hoặc "domloaded" và một số trình duyệt hiện đại hỗ trợ trực tiếp (ví dụ: Firefox có sự kiện DomContentLoaded) và trên các trình duyệt khác có thể được mô phỏng bằng nhiều thủ thuật khác nhau, như sử dụng thuộc tính defer hoặc đặt tập lệnh ở phần cuối của cơ thể.
Lợi thế là bạn có thể tương tác đáng tin cậy với tài liệu tại thời điểm này; ví dụ bạn có thể thiết lập một trình xử lý sự kiện trên một phần tử với một ID nào đó và chắc chắn rằng nó đã tồn tại trong cây DOM. Mặt khác, nó có thể chạy sớm hơn đáng kể so với sự kiện tải, nếu một số tài nguyên bên ngoài tải chậm. Nếu tập lệnh của bạn ở cuối mã HTML, thì có thể có ít sự khác biệt trong việc sử dụng hoặc không sử dụng sự kiện domready, nhưng thường các tập lệnh được gọi từ thẻ head và tại thời điểm đó, không có phần tử nào của cơ thể.
Tôi không nghĩ rằng mọi thứ sẽ cháy trừ khi bạn đóng dấu ngoặc đơn đó. jQuery không loại bỏ sự cần thiết cho cú pháp thích hợp! – chriscauley