Должен ли я использовать window.load или document.ready jquery

Недавно я увидел, что вы можете использовать

$('document').ready(function() {
//Do Code
});

или

$('window').load(function() {
//Do Code
});

для jQuery.

Однако они кажутся мне одинаковыми! Но ясно, что нет.

Итак, мой вопрос: какой из них следует использовать для создания веб-сайта на основе анимации и асинхронизации? А также, какой из двух лучше всего использовать?

Спасибо.

Ответ 1

$('document').ready запускает код, когда DOM готов, но не когда загружена сама страница, то есть сайт не был раскрашен, а содержимое, как изображения, не было загружено.

$(window).load запускает код, когда страница была расписана, и все содержимое загружено. Это может быть полезно, когда вам нужно получить размер изображения. Если изображение не имеет стиля или ширины/высоты, вы не можете получить его размер, если не используете $(window).load.

Ответ 2

Ну, в первую очередь, вы можете захотеть использовать "готовое" событие, которое вы можете обработать следующим образом:

$().ready(function() {
  ...
});

Или, более лаконично и идиоматично:

$(function() {
  ...
});

Обработчик "load" действительно относится к реальному событию и может обрабатываться несколькими различными типами элементов: <img> и <iframe>, например. Событие "load" на уровне документа или окна происходит, когда загружаются все ресурсы страницы. Однако (в некоторых браузерах) "готовое" событие происходит, когда страница DOM готова, но, возможно, перед вещами типа <img>.

Другой вариант - просто поместить теги <script> в самый конец <body> или даже после <body>. Таким образом, скрипты имеют всю DOM для работы, но вам не нужно беспокоиться о каких-либо событиях, чтобы это знать.