jQuery document.ready против самостоятельного вызова анонимной функции - PullRequest
135 голосов
/ 15 июля 2010

В чем разница между этими двумя.

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

  2. (function(){ ... })();

Обе эти функции вызываются одновременно?Я знаю, что document.ready будет запущен, когда вся HTML-страница будет отображаться браузером, но как насчет 2-й функции (самозвонящая анонимная функция).Ожидает ли браузер завершения рендеринга страницы или он вызывается всякий раз, когда он встречается?

Ответы [ 5 ]

110 голосов
/ 16 июля 2010
  • $(document).ready(function(){ ... }); или короткий $(function(){...});

    Эта функция вызывается, когда DOM is ready, что означает, что вы можете начать, например, запрос элементов. .ready() будет использовать разные способы в разных браузерах, чтобы убедиться, что DOM действительно готов.

  • (function(){ ... })();

    Это не что иное, как функция, которая вызывает себя как можно скорее, когда браузер интерпретирует ваш ecma-/javascript. Поэтому очень маловероятно, что вы сможете успешно действовать здесь на DOM elements.

46 голосов
/ 16 июля 2010

(function(){...})(); будет выполнено, как только оно встретится в Javascript.

$(document).ready() будет выполнено после загрузки документа. $(function(){...}); является сокращением для $(document).ready() и делает то же самое.

25 голосов
/ 16 июля 2010
  1. $(document).ready(function() { ... }); просто связывает эту функцию с событием ready документа, поэтому, как вы сказали, при загрузке документа событие срабатывает.

  2. (function($) { ... })(jQuery); на самом деле является конструкцией Javascript, и все, что делает этот фрагмент кода, это передает объект jQuery в function($) в качестве параметра и выполняет функцию, поэтому внутри этой функции $ всегда относится к объекту jQuery. Это может помочь разрешить конфликты пространства имен и т. Д.

Таким образом, # 1 выполняется при загрузке документа, а # 2 запускается немедленно, с кратким обозначением jQuery объекта с именем $.

24 голосов
/ 17 сентября 2015

Следующий код будет выполнен, когда DOM (объектная модель документа) будет готова для выполнения кода JavaScript.

$(document).ready(function(){
  // Write code here
}); 

Сокращение для приведенного выше кода:

$(function(){
  // write code here
});

Код, показанный ниже, представляет собой самозапускающуюся анонимную функцию JavaScript и будет выполняться, как только браузер ее интерпретирует:

(function(){
  //write code here
})();   // It is the parenthesis here that call the function.

Самовозвратная функция jQuery, показанная ниже, передает глобальный объект jQuery какаргумент function($).Это позволяет локально использовать $ в пределах функции, вызывающей себя, без необходимости проходить через глобальную область определения.jQuery - не единственная библиотека, использующая $, поэтому это уменьшает потенциальные конфликты имен.

(function($){
  //some code
})(jQuery);
16 голосов
/ 16 июля 2010

document.ready запущен после того, как DOM "построен". Самопризываемые функции запускаются мгновенно - если они вставлены в <head>, до того, как DOM будет создан.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...