Динамическая загрузка jQuery

Следующий код динамически загрузит jQuery и выведет сообщение о об успешной загрузке:

var script = document.createElement(''script'');
script.type = ''text/javascript'';
script.src = ''https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'';
document.getElementsByTagName(''head'')[0].appendChild(script);
script.addEventListener(''load'', function(){
$(document).ready(function() {
alert(''jQuery загружен.'');
});
}, false);

Здесь мы создаём новый элемент script, затем помещаем его в секцию head и вешаем на него обработчик события load, в который передаём функцию, и она сработает, когда наша библиотека будет загружена. Можно также поместить этот в отдельную функцию и вызвать её по нажатию определённой кнопки.

<button id="mybutton" onclick="addJquery()">Загрузить jQuery</button>

function addJquery() {
var script = document.createElement(''script'');
script.type = ''text/javascript'';
script.src = ''https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'';
document.getElementsByTagName(''head'')[0].appendChild(script);
script.addEventListener(''load'', function(){
$(document).ready(function() {
alert(''jQuery загружен.'');
});
}, false);
}

Динамическая загрузка jQuery будет выполнена после нажатия на кнопку. В приведённых выше кодах мы используем загрузку jQuery с сайта Google API, но можно подгружать эту библиотеку со своего сайта, или любого другого источника. Просто смените путь к ней в script.src.

Вообще-то, этим методом можно подключить любой внешний JavaScript.