Упорядоченная загрузка файла JavaScript

Question

Мне нужно динамически загрузить несколько файловых ресурсов JavaScript в очень специфическом порядке после загрузки страницы.Я пытаюсь использовать onload, но, похоже, это срабатывает до полной загрузки ресурса.Как мне настроить приведенный ниже скрипт для запуска правильного обратного вызова для загрузки следующего скрипта?

Примечание. Работает только в последних версиях Chrome, FF, Safari и IE9.* function loadAssets() { // Setup script var scriptJS = document.createElement('script'); scriptJS.type = 'text/javascript'; scriptJS.src = objectUrl; scriptJS.onload = loadAssetsNext(); // Begin insertion var headerJS = document.getElementsByTagName('HEAD'); headerJS[0].appendChild(scriptJS); }, function loadAssetsNext() { // Increment object counter objectsCount++; // Test to see if you should call another item if ((objectsCount) < objects.length) { // Setup script var scriptJS = document.createElement('script'); scriptJS.type = 'text/javascript'; scriptJS.src = nextObjectUrl; // Declare callback to fire after script has fully loaded scriptJS.onload = loadAssetsNext(); // Begin insertion var headerJS = document.getElementsByTagName('HEAD'); headerJS[0].appendChild(scriptJS); } } Мне нужно что-то вроде scriptJS.fullyLoaded = doStuff.Не знаю, куда идти отсюда.

PS jQuery - это не вариант или другая библиотека.Вы должны быть в состоянии сделать это, слегка изменив приведенный выше скрипт.

Answer 1

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

scriptJS.onload = loadAssetsNext();

Это просто присваивает возвращаемое значение из вызова loadAssetsNext свойству onload объекта scriptJS. То, что вы собираетесь сделать, это:

scriptJS.onload = loadAssetsNext;

То, что устанавливает обработчик onload в качестве функции loadAssests. Это должно решить ваши проблемы.

Answer 2

Мне кажется, проблема в том, что ваш scriptJS.onload = loadAssetsNext(); помещен перед headerJS[0].appendChild(scriptJS); Это означает, что ваши скрипты будут загружаться и добавляться на страницу следующим образом:
загрузить скрипт 1
загрузить скрипт 2
загрузить скрипт 3
...
добавить скрипт 3
добавить скрипт 2
добавить скрипт 1

Так что я думаю, что вы должны просто немного переупорядочить ваш скрипт.