Что происходит, когда у вас есть два вызова jQuery $ (document) .ready в двух файлах JavaScript, используемых на одной и той же HTML-странице? - PullRequest
Новая
       17

Что происходит, когда у вас есть два вызова jQuery $ (document) .ready в двух файлах JavaScript, используемых на одной и той же HTML-странице?

35 голосов
/ 22 июня 2011

У меня есть вопрос по jQuery $(document).ready

Допустим, у нас есть HTML-страница, которая включает 2 JavaScript файлов 

<script language="javascript" src="script1.js" ></script>
<script language="javascript" src="script2.js" ></script>

Теперь, скажем, в обоихэти файлы сценариев, у нас есть $(document) следующим образом

Внутри script1.js : 

$(document).ready(function(){
    globalVar = 1;
})

Внутри script2.js : 

$(document).ready(function(){
    globalVar = 2;
})

Теперь мои Вопросы :

  1. Будут ли запущены обе эти функции готовности?
  2. Если да, в каком порядке они будут уволены, поскольку документ будет готов одновременно для них обоих?
  3. Рекомендуется ли такой подход ИЛИ в идеале мы должны иметь только1 $ (документ) .ready?
  4. Одинаков ли порядок выполнения во всех браузерах (IE, FF и т. Д.)?

Спасибо.

Ответы [ 5 ]

34 голосов
/ 22 июня 2011
  1. Будут ли запущены обе эти функции готовности?

Да, они оба будут запущены.

в каком порядке они будут уволены, поскольку документ будет готов одновременно для них обоих?

в том виде, в котором они отображаются (сверху вниз)потому что событие ready будет запущено один раз, и все слушатели будут получать уведомления один за другим.

Рекомендуется ли этот подход ИЛИ в идеале у нас должно быть всего 1 $ (документ) .ready?

Это нормально делать так.Если вы можете иметь их в одном и том же блочном коде, им будет легче управлять, но это все, что нужно сделать. Обновление : Очевидно, я забыл упомянуть, что вы увеличите размер кода JavaScript, если вы сделаете это в нескольких файлах.

Одинаков ли порядок выполнения во всех браузерах (IE, FF и т. Д.)?

Да, поскольку jQuery берет на себя кросс-браузерную нормализацию.

9 голосов
/ 22 июня 2011

См. Здесь: jQuery - плохо ли иметь несколько $ (document) .ready (function () {}); и здесь: Учебники: Multiple $ (document) .ready ()

  1. Да
  2. Порядок прикрепления. jQuery внутренне поддерживает readyList с Deferred объектами .
  3. Это частично вопрос вкуса.Наличие обработчика one ready даст вам хороший обзор всего, что происходит, в то время как множественный (т.е. по одному на каждый включенный файл) сделает ваш код гораздо более модульным (т.е. вы можетевключите или удалите файл .js и убедитесь, что он предоставляет и связывает свой собственный готовый обработчик).
  4. Да - порядок подключения.
2 голосов
/ 22 июня 2011

Вы можете рассчитывать на то, что оба обработчика будут выполняться в порядке их включения в скрипт, а globalVar будет 2 после второй ссылки на скрипт в любом текущем браузере.

0 голосов
/ 22 июня 2011
  1. Оба будут уволены
  2. Значение переменной будет равно 2 после того, как вся пыль осядет.
  3. Главное, что не рекомендуется, это использовать 2 разных файла JS, как рекомендует Google PageSpeed, и Yahoo YSlow рекомендует, чтобы все ваши коды Javascript были в одном файле. Что касается одних и тех же обработчиков событий, то, честно говоря, я не вижу причин для этого, и это только сделает ваш код читабельнее более легким.
  4. У меня нет ответа на этот вопрос.
0 голосов
/ 22 июня 2011

Если вам нужен полный контроль, я настоятельно рекомендую только one $ (document) .ready ();

Если вы загружаете частичные части HTML через ajax иответ ajax включает скрипт $ (document) .ready (); - и вы хотите запустить $ (document) .ready ();из script1.js, script2.js и т. д. в обратном вызове ajax .. Вам нужно продублировать МНОГО кода ....

Удачи!

/$ (окна) .ready ();;)

...