Я использую RequireJS, и мне нужно что-то инициализировать в DOM. Теперь RequireJS предоставляет domReady
плагин , но у нас уже есть jQuery $(document).ready()
, который мне доступен, поскольку мне нужен jQuery.
Итак, у меня есть два варианта:
Используйте
domReady
плагин:require(['domReady'], function (domReady) { domReady(function () { // Do my stuff here... }); });
Использование
$(document).ready()
:$(document).ready(function() { // Do my stuff here... });
Какой выбрать и почему?
Оба варианта работают, как ожидалось. Я не уверен в jQuery, потому что RequireJS творит чудеса; то есть, поскольку RequireJS будет динамически добавлять сценарии, меня беспокоит, что готовность DOM может произойти до того, как будут загружены все динамически запрашиваемые сценарии. Принимая во внимание, что RequireJS добавит нагрузку на дополнительный JS только domReady
тогда, когда мне уже требуется jQuery.
Вопросы
- Почему RequireJS предоставляет
domReady
плагин, если у нас может быть jQuery$(document).ready();
? Я не вижу никаких преимуществ в включении другой зависимости. - Если это просто для удовлетворения потребности, то почему бы не предоставить его для кросс-браузерного AJAX?
Насколько я знаю, требующийся модуль domReady
не будет извлечен или выполнен после того, как документ будет готов, и вы можете сделать то же самое, требуя jQuery:
require(['jQuery'], function ($) {
$(document).ready(function () {
// Do my stuff here...
});
});
Чтобы быть более ясным по моему вопросу: в чем разница между требованием domReady
или jQuery
?
источник
I am not confident in jquery's dom ready
Я хочу отметить это как оскорбление:p
script
идут ваши теги, или вы пишете библиотеку / плагин, которые будут использовать другие люди (и поэтому они контролируют расположениеscript
тегов в разметке)?I am not confident in jquery's dom ready because requirejs is doing its magic.
Поскольку require инкапсулирует jquery в ограниченной локальной области. Дело не в этом. (что касается вопроса).Ответы:
Вроде бы все ключевые моменты уже были достигнуты, но некоторые детали провалились. В основном:
domReady
Это и плагин, и модуль. Если вы включите его в массив требований,
!
ваш модуль не будет выполняться до тех пор, пока не станет «безопасным» взаимодействовать с DOM:Обратите внимание, что загрузка и выполнение отличаются; вы хотите, чтобы все ваши файлы загружались как можно скорее, так как выполнение содержимого зависит от времени.
Если вы опустите
!
, то это просто обычный модуль, который оказывается функцией, которая может принимать обратный вызов, который не будет выполняться до того, как DOM станет безопасным для взаимодействия с:Преимущество использования domReady в качестве плагина
Код, который зависит от модуля, который, в свою очередь, зависит от модуля,
domReady!
имеет очень важное преимущество: ему не нужно ждать, пока DOM будет готов!Скажем, у нас есть блок кода A, который зависит от модуля B, который зависит от
domReady!
. Модуль B не завершит загрузку, пока DOM не будет готов. В свою очередь, A не запустится, пока не загрузится B.Если бы вы использовали
domReady
в качестве обычного модуля в B, для A также необходимо было бы зависетьdomReady
, а также заключать его код внутриdomReady()
вызова функции.Кроме того, это означает, что
domReady!
пользуется тем же преимуществом$(document).ready()
.Повторите различия между domReady и $ (document) .ready ()
Оба определяют, готова ли модель DOM и когда это происходит, по существу одинаково.
Опасайтесь того, что jQuery запустится не в то время
jQuery будет запускать любой готовый обратный вызов, даже если DOM загружается до того, как это сделает jQuery (ваш код не должен заботиться о том, что произойдет первым).
источник
Попытка ответить на ваш главный вопрос:
На самом деле они делают две разные вещи. Зависимость RequireJS
domReady
означает, что этот модуль требует, чтобы DOM была полностью загружена, прежде чем его можно будет запустить (и поэтому его можно найти в любом количестве модулей в вашем приложении, если вы того пожелаете), в то время как$(document).ready()
вместо этого запускает свои функции обратного вызова, когда DOM загрузка завершена.Разница может показаться незначительной, но подумайте вот о чем: у меня есть модуль, который нужно каким-то образом связать с DOM, поэтому я могу либо зависеть от него
domReady
и связать его во время определения модуля, либо поставить$(document).ready()
в конце с обратным вызовом функции инициализации для модуля. Я бы назвал первый подход уборщиком.Между тем, если у меня есть событие, которое должно произойти сразу после того, как DOM будет готов, это
$(document).ready()
событие будет подходящим , поскольку это, в частности, не зависит от того, как RequireJS выполняет загрузку модулей, при условии зависимостей кода, который вы звонящий из встречаются.Также стоит учесть, что не обязательно использовать RequireJS с jQuery. Любой библиотечный модуль, которому требуется доступ к DOM (но не полагающийся на jQuery), будет по-прежнему полезен при использовании
domReady
.источник
domReady
не является зависимостью от requirejs. Это будет зависимость для кода, если вы используетеdomReady
событие DocumentReady. К тому же ты, кажется, сбиваешь с толку.domReady
зависимость, потому что это то, как она используется. Не как зависимость от RequireJS, а от модуля, в котором он используется. Может быть, мне стоит сделать это более ясным в моем тексте, у вас есть предложения, как?Отвечаем на пули в порядке появления:
Когда дело доходит до этого, вы слишком много думаете об этом. Это механизм для выполнения javascript на domReady. Если бы у вас не было jQuery, я бы поддержал плагин domReady. Поскольку у вас есть jQuery, не загружайте больше скриптов для выполнения того, что уже доступно.
Обновление ясности
Плагин domReady собирает функции для вызова, когда документ «готов». Если он уже загружен, они выполняются немедленно.
JQuery собирает функции и связывает отложенный объект с «готовым» домом. Когда dom будет готов, отложенный объект будет разрешен, и функции будут запущены. Если dom уже «готов», то отложенный вызов уже будет разрешен, поэтому функция будет выполнена немедленно.
Это означает, что они фактически делают то же самое.
источник
После некоторых экспериментов с requirejs с несколькими модулями я предлагаю использовать domReady .
Я заметил, что функция, связанная с $ (document) .ready (...) , не вызывается, когда несколько модулей загружаются с помощью requirejs. Я подозреваю, что dom готовится до того, как будет выполнен весь код requirejs, и вызывается обработчик обратного вызова jquery ready до того, как он будет привязан к пользовательской функции, то есть в коде основного модуля.
источник
$(document).ready
будет запущен немедленно.Я обнаружил, что делаю это как часть основной записи, чтобы для всего моего javascript было гарантировано, что DOM готов и jquery загружен. Не уверен, насколько это здорово, поэтому приветствую любые отзывы, но вот мой main.js:
источник