JavaScript - Как загрузить внешний скрипт Неасинхронно?

Question

Я ищу код, который позволяет мне использовать JavaScript для загрузки другого файла JavaScript NON-асинхронно. Я пробовал это:

var script=document.createElement('script'); 
script.setAttribute("type","text/javascript"); 
script.setAttribute("src", "jquery.min.js"); 
document.getElementsByTagName("head")[0].appendChild(script); 

$("div.whatever").css("color","red"); 

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

Есть ли способ загрузить этот скрипт не-асинхронный, используя собственный JS?

Answer 1

Вы можете использовать либо <script> узлам .onload обработчик события, чтобы продолжить/выполнить любой код, который должен быть выполнен после того, как сценарий был загружен, как

script.onload = function() { 
    // continune here 
}; 

или вы можете попытаться установить async флаг false

script.setAttribute("async", false); 

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

Answer 2

Вместо загрузки синхронно, немного лучшей идеей было бы использовать onload:

script.onload = function() { 
    // $ is defined now 
}; 

// append it only now to make sure it does not load before setting onload 
document.getElementsByTagName("head")[0].appendChild(script);