Как загружаются скрипты?

Есть такая страница
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id="container"></div>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>


в main.js есть код, который подключает скрипты и стили на эту страницу.

containerWrap = document.getElementById("container");
var jQueryMinJs = document.createElement("script");
jQueryMinJs.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js";
containerWrap.appendChild(jQueryMinJs);

var script__ = document.createElement("script");
jQueryUiMinJs.src = "js/script__.js";
containerWrap.appendChild(script__);


Скрипт script__.js использует jQuery. Все скрипты подключатся в результате загрузки страницы, но консоль выдаёт ошибку
$ is not defined
как будто jQuery не загрузился на страницу. Как решить эту проблему?
  • Вопрос задан
  • 216 просмотров
Решения вопроса 1
miraage
@miraage
Старый прогер
Эти скрипты загружаются асинхронно.
Попробуйте как-то так:

containerWrap = document.getElementById("container");

var jQueryMinJs = document.createElement("script");
jQueryMinJs.onload = loadOtherScripts;

jQueryMinJs.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js";
containerWrap.appendChild(jQueryMinJs);

function loadOtherScripts() {
  $.getScript('js/script__.js', function () {
    console.log('script__.js loaded');
  });
}
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@LinGG
если скрипты объявлены в документе - они загружаются синхронно, так как важна последовательность из-за зависимотси одного скрипта от другого, если они добавляются динамически в тело документа - асинхронно.
если никак нельзя обойтись без синхронного объявления - можно использовать onload callback, как написано выше.
Ответ написан
Комментировать
А если добавить jQueryMinJs.async = false;
Блок "Забегая вперед" в конце урока - https://learn.javascript.ru/external-script
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы