jQuery document.ready vs анонімна функція самовикликання

137

Яка різниця між цими двома.

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

Ці обидві функції одночасно викликаються? Я знаю, document.ready буде спрацьовувати, коли вся веб-сторінка HTML буде надана браузером, але що стосується 2-ої функції (самовикликання анонімної функції). Чи чекає, коли браузер закінчить візуалізацію сторінки, або вона викликається, коли вона виникає?

javascript jquery

— Ашит Вора
джерело

18

Те, що воно варте, $(function() {});еквівалентно$(document).ready(function() {});

— Іен Генрі

1

Самоанонімна анонімна функція буде виконуватися щоразу, коли вона зустрінеться. Також фактично візуалізація документа на екрані та створення об'єктної моделі в пам'яті не пов'язані між собою.

— Анураг

пов'язано: Чому визначати анонімну функцію та передавати її jQuery як аргумент? за якою схемою використовувати з хребтом

— Бергі

4

Ви дійсно повинні приймати відповіді на свої запитання, коли вони ефективно дають відповіді на них. У вас дуже низький рівень прийняття.

— leigero

Не перший jQuery спосіб зробити перший: document.addEventListener ('domContentLoaded', function () {...});

— Еван Томпсон,

112

$(document).ready(function(){ ... }); або короткий $(function(){...});

Ця функція викликається, коли це DOM is readyозначає, що ви можете почати запитувати елементи, наприклад. .ready()використовуватимуть різні способи в різних браузерах, щоб переконатися, що DOM дійсно готовий.
(function(){ ... })();

Це не що інше, як функція, яка викликає себе якомога швидше, коли браузер інтерпретує ваш ecma-/javascript. Тому малоймовірно, що тут можна успішно діяти DOM elements.

— jAndy
джерело

1

@NimChimpsky я переплутався (функція () {}); з $ (функція () {}). Ви протилежне неправильному;)

— ALH

Я розгублений щодо того, (function(){ ... })();чи не запускається якийсь код JS якнайшвидше? Якби ви сказали, alert()всередині SIAF або поза ним, чи не був би такий ефект?

— skube

2

@skube Так, будь-який код JS запуститься, як тільки його прочитає аналізатор, але може виникнути ваша плутанина в тому, чи є "$" перед SIAF чи ні. Якщо так, і цей веб-сайт використовує jQuery, то це скорочена форма допоміжної функції jQuery document.ready, яка планує виконати дану функцію після отримання DOM. Сама функція помічника запуститься, як тільки вона буде прочитана, але функція, якою ви її постачаєте, не буде.

— Ніл Монро

46

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

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

— Міхал
джерело

25

$(document).ready(function() { ... });просто прив'язує цю функцію до readyподії документа, тому, як ви вже говорили, коли документ завантажується, подія запускається.
(function($) { ... })(jQuery);насправді є конструкцією Javascript, і все, що цей фрагмент коду робить, передає jQueryоб'єкт у function($)параметр і виконує функцію, тому всередині цієї функції $завжди посилається на jQueryоб'єкт. Це може допомогти вирішити конфлікти, що змінюють імена тощо.

Таким чином, №1 виконується при завантаженні документа, тоді як №2 запускається негайно, з jQueryоб'єктом, названим $як стенограма.

— Алан Крістофер Томас
джерело

25

Наступний код буде виконаний, коли DOM (Document object model) буде готовий до виконання коду 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);

— JSON C11
джерело

2

Дуже просте, чітке і стисле пояснення закриття javascript.

— КОД

16

document.ready запускається після "побудови" DOM. Функції самовикликання запускаються миттєво - якщо їх вставити до того <head>, як буде побудовано DOM.

— srigi
джерело

6

+1, щоб протистояти непотрібному голосному поводу Однак у вашій відповіді є невелика проблема. Функція самовикликання виконуватиметься там, де вона буде знайдена під час розбору, і не обов'язково повинна знаходитися всередині <head>, а правила не відрізняються після побудови початкового DOM.

— Анураг