Как определить, когда jQuery будет загружен?

Question

[DTX]

Вроде видел что-то похожее на

function ($) {
  // Тут работа с jQuery
}

Но вспомнить не могу

Answer 1

[Сергей Горностаев]

На 100% гарантированный метод только один: тег загрузки jQuery в head, а сам скрипт использующий jQuery в конец body и обернуть код в $(document).ready(function() { ... });.

Но если очень надо вынести загрузку скриптов из head, то проверить можно так:

Костыль №1

if (window.jQuery) {  
    ...
}

Костыль №2

if (typeof jQuery == 'undefined') {  
    ...
}

Comments

[DTX]

Так может я хочу jQuery из head вынести

[Сергей delphinpro]

DTX: Выноси. Но подключение jquery должно быть перед подключением вашего скрипта, использующего jquery

script:src=jquery.js
script:src=myscripts.js

и в своем скрипте пишите вышеуказанную конструкцию, а в ней код.
Однако, если вы подключаете все скрипты в конце страницы, то данная конструкция необязательно, DOM к этому времени все равно уже загружен и построен.

[DTX]

Сергей: т.е. скрипты на странице не будут выполнятся, пока не загрузятся все вышестояющие скрипты?

[SagePtr]

DTX: да, если не задать этим вышестоящим скрипам атрибут async или defer.

[DTX]

SagePtr: Понял, спасибо

[Сергей delphinpro]

DTX: скрипты загружаются и выполняются последовательно, в порядке их подключения (при отсутствии атрибута async)

Answer 2

[iBird Rose]

всмысле как определить? ты сам пишешь когда тебе нужно. к примеру:

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

- начнёт работу тогда, когда будет готов DOM, за исключением картинок

$(window).load(function() { ... }); - код будет запущен когда страница будет полностью загружена, включая все фреймы, объекты и изображения

Comments

[Сергей Горностаев]

Конструкция $(function (){ ...}); - это всего лишь изоляция пространства имён, определить загружена jQuery или нет она не поможет. А обращение к $ без загруженной jQuery приведёт к ошибке.

Answer 3

[Назар Мокринский]

1) Если у вас синхронные скрипты, то достаточно подключить jQuery раньше скрипта, где она используется
2) Если скрипты асинхронные, то лучше всего использовать как AMD модуль через RequireJS (или Alameda если современный браузер)