Я видел это (я также использую его):
$(document).ready(function(){
// do jQuery
})
а также это (я пробовал в последнее время):
(function(){
// do jQuery
})(jQuery)
оба работают нормально.
В чем разница между двумя (за исключением того, как это выглядит)?
Какой из них более подходит для использования?
В первом примере выполняется функция, когда построено дерево DOM. Второй пример запускает функцию сразу.
Если вы посмотрите внимательно, во втором примере после объявления функции есть две круглые скобки (в этом конкретном случае вы передаете глобальный объект jQuery в качестве аргумента, чтобы избежать конфликта), тем самым немедленно вызывая функцию
Правильная функция для использования зависит от того, когда вы хотите, чтобы функция запускалась.
Если вы хотите запустить функцию в DOMReady (событие ready), вы можете использовать $( document ).ready, как вы упомянули, или сокращенное $( function() {...} ).
В противном случае, если вы хотите немедленно запустить функцию и иметь область анонимной функции, используйте второй пример.
Второй пример, который вы показываете, - это самозапускающаяся анонимная функция. Каждый отдельный JS файл, который вы используете, вероятно, выиграет от его использования. Он предоставляет частную область, где все, что вы объявляете с помощью ключевого слова var, остается только внутри этой области:
(function($){
var special = "nice!";
})(jQuery);
alert(special); // would be undefined
Первый пример - сокращение для $(document).ready, которое срабатывает, когда DOM можно манипулировать.
Несколько классных вещей об этом. Во-первых, вы можете использовать его внутри собственной функции:
(function($){
$(function(){
// Run on DOM ready
});
// Run right away
})(jQuery);
Во-вторых, если вам нужно всего несколько строк в готовом документе, вы можете объединить как личную область, так и функцию готовности DOM следующим образом:
jQuery(function($){
// $ = jQuery regardless of what it means
// outside this DOM ready function
});
Я всегда использую первый. Второй, по-видимому, является способом защиты от переоценки jquery. Одна из причин, почему вы можете это сделать, - это не знать, какие другие скрипты будут загружены на страницу. Если все ваши вещи зависят от, скажем, jquery 1.3, и вы находитесь в среде, где вы не контролируете всю страницу, ваш код может сломаться, если кто-то загружает jQuery 1.4. Звучит уродливо, но такого рода вещи случаются. Таким образом, вы можете закрыть свой прикладок, создав закрытие сразу после загрузки jquery и удерживая вашу версию jquery внутри этого закрытия. Я думаю, что то, что происходит во втором примере.
Ни один из них не инициализирует jquery. Jquery позаботится о любой инициализации, в которой она нуждается сама по себе. Вы все равно, скорее всего, закончите с использованием первого примера, даже если вы использовали второй, вы просто ставите $(document).ready внутри функции во втором примере.
В дополнение ко всем предыдущим ответам, В jQuery есть три метода инициализации, которые можно использовать:
Традиционный метод, совместимый с большинством браузеров, см. в коде:
$(document).ready(function () {
});
Краткосрочный метод, см. код:
$(function () {
});
Неявный метод, см. код:
$().ready(function () {
});
Все они работают для современных браузеров и безопасны в использовании.