В чем разница между двумя форматами в javascript / jquery?

Question

В чем разница между двумя форматами в javascript / jquery?

0

Учитывая эти два фрагмента:

$.ready(function()
{
     ……
}

а также

(function($){
  $(function(){

    ……

  });
})(jQuery);

Кажется, я использую первый формат, но он не работает, поэтому я хотел бы знать, в чем разница между ними?

Кроме того, существует ли разница между помещением <script src=""/> в нижней части страницы и head?

A New Star 03 окт. 2013, в 06:05

Источник

0

Мне лично легче использовать jQuery(function($) { ... }); вместо.
Ja͢ck 03 окт. 2013, в 03:48

Теги:

javascript

jquery

3 ответа

3

Разница между ними состоит в том, что первый предполагает, что jQuery задается переменной $. Второе - нет.

Второй определяет $ в песочнице, как параметр для функции, а затем передает jQuery для этого параметра. Это обычный способ использования сокращенного $ даже в режиме noConflict.

(function($){  // <----- $ is defined ONLY within THIS function
  $(function(){
    ……
  });
})(jQuery);    // <------- jQuery being passed in for $

Adam Rackis 03 окт. 2013, в 01:03

0

Чтобы ответить на ваш последний вопрос:

Вставка javascript в нижней части страницы гарантирует, что HTML-страница страницы будет загружена до ее выполнения. Насколько я знаю, включение javascript файла в нижней части страницы ставит его порядок загрузки позади остальных файлов.

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

Emile Victor 03 окт. 2013, в 01:48

0

Фрагменты не идентичны. Первый вызывает jQuery.ready , второй вызывает jQuery.fn.ready .
Felix Kling 03 окт. 2013, в 03:41

Ещё вопросы

Мне лично легче использовать jQuery(function($) { ... }); вместо.
Фрагменты не идентичны. Первый вызывает jQuery.ready , второй вызывает jQuery.fn.ready .

Felix Kling · Accepted Answer · 2013-10-03T00-58-00.000Z

Разница между прочим заключается в том, что эти два являются разными функциями:

jQuery.ready - это внутренний метод запуска готового события. Он не ожидает функции как аргумент, а логический.
$(function) является ярлыком для jQuery.fn.ready, который является методом API для привязки готовых обработчиков событий, то есть функций, которые должны запускаться при загрузке DOM.

Итак, первый "не работает", потому что он просто не делает того, что, по вашему мнению, он делает. Я рекомендую прочитать документацию .ready.

Тот факт, что вторая обернута в выражение, вызываемое сразу вызываемой функцией, не влияет на функциональность.

Кроме того, существует ли разница между помещением <script src=""/> в нижней части страницы и головы?

Предполагая, что вы говорите о привязке обработчиков к готовому событию, тогда нет, нет никакой разницы в выполнении.

Для тех, кто не хочет следовать ссылкам:

jQuery.ready:

// Handle when the DOM is ready
ready: function( wait ) {

    // Abort if there are pending holds or we're already ready
    if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
        return;
    }

    // Remember that the DOM is ready
    jQuery.isReady = true;

    // If a normal DOM Ready event fired, decrement, and wait if need be
    if ( wait !== true && --jQuery.readyWait > 0 ) {
        return;
    }

    // If there are functions bound, to execute
    readyList.resolveWith( document, [ jQuery ] );

    // Trigger any bound ready events
    if ( jQuery.fn.trigger ) {
        jQuery( document ).trigger("ready").off("ready");
    }
},

jQuery.fn.ready:

ready: function( fn ) {  
    // Add the callback
    jQuery.ready.promise().done( fn );

    return this;
},

Помещение скриптов в заголовок влияет на поведение загрузки (время), а не на их конец <body> .