Загрузка зависимостей javascript по запросу

вы можете загружать скрипт динамически, добавляя тег <script src = "..."> в дерево DOM.

function loadJSInclude(scriptPath, callback)
{
    var scriptNode = document.createElement('SCRIPT');
    scriptNode.type = 'text/javascript';
    scriptNode.src = scriptPath;

    var headNode = document.getElementsByTagName('HEAD');
    if (headNode[0] != null)
        headNode[0].appendChild(scriptNode);

    if (callback != null)    
    {
        scriptNode.onreadystagechange = callback;            
        scriptNode.onload = callback;
    }
}

И использовать (в качестве примера я использовал swfObject):

var callbackMethod = function ()
{
    // Code to do after loading swfObject
}

// Include SWFObject if its needed
if (typeof(SWFObject) == 'undefined')    
    loadJSInclude('/js/swfObject.js', callbackMethod);
else
    callbackMethod();

Возможно, вы захотите взглянуть на jsloader: http://www.jsloader.com/

Это делает Gaia Ajax (я знаю с тех пор, как реализовал это - я первоначальный основатель), и они GPL. Так что, если вы не боитесь, что они подадут на вас в суд (сейчас они обманывают меня судебными исками), вы можете проверить, как они это делают. Базовая технология заключается во внедрении тега сценария с использованием DOM, когда сценарий необходим. Хотя вы должны позаботиться о том, чтобы НЕ ссылаться на материалы в этом файле до того, как он завершит загрузку (что происходит асинхронно).

Решение этой проблемы (одно из решений) состоит в том, чтобы добавить переменную в конец файла и использовать рекурсивные вызовы setTimeout, чтобы проверить, определена ли переменная, и отложить выполнение кода в зависимости от того, загружается ли файл, до этого "дна" JS файла "определена переменная ...

Фактически мы также отслеживали, какие файлы были включены, добавляя хешированное значение имен файлов в скрытое поле на странице. Это означает, что мы никогда не включали один и тот же файл более одного раза ...

На самом деле довольно изящно ...

API Google AJAX обеспечивают динамическую загрузку API JavaScript Google. В документации есть пример загрузка Maps JS по запросу:

function mapsLoaded() {
  var map = new google.maps.Map2(document.getElementById("map"));
  map.setCenter(new google.maps.LatLng(37.4419, -122.1419), 13);
}

function loadMaps() {
  google.load("maps", "2", {"callback" : mapsLoaded});
}

Возможно, вы захотите взглянуть на настоящий ДЕМО на сайте недвижимости.

На демонстрационной странице просто нажмите ссылку [Xem bản đồ], чтобы увидеть карту, загружаемую по запросу. Карта загружается только при нажатии на ссылку, а не во время загрузки страницы, поэтому это может сократить время загрузки страницы.