Стандартный способ включить библиотеку javascript из javascript

Question

Я хотел бы получить библиотеку jquery из моего включенного JavaScript.

Это работает в 100% случаев? Есть ли лучший способ?

(function() {

var loadJquery = function (cb) {
    var addLibs = function () {
        if (typeof(document.body) == "undefined" || document.body === null) {
            setTimeout(addLibs, 100);
            return;
        }

        var node = document.createElement("script");
        node.src = "http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js";
        document.body.appendChild(node);
        checkLib();
    };

    var checkLib = function () {  
        if (typeof($) == "undefined" || $("*") === null) {
            setTimeout(checkLib, 100);
            return;
        }
        cb($.noConflict());
    }
    addLibs();
}

loadJquery(function($){
  // Do stuff with $
  $(document.body).css("background", "black");
});

})();

Измените node.src и $.noConflict на YUI, если вы хотите YUI3, или YAHOO, если вы YUI2 и т. Д.

Answer 1

Есть только одна проблема, о которой я могу думать с этим подходом (и она дважды поднималась в вопросах о SO за последний месяц).

Проблема в том, что jQuery, начиная с 1.3.2, не может определить, загружен ли документ, если он сам включен после загрузки документа (т. Е. Динамическое включение <script>, как вы делаете, закладка и т. Д.) В не -IE браузеры. В таких случаях функция, переданная в .ready(), никогда не будет вызвана.

Вот отчет об ошибке для проблемы: http://dev.jquery.com/ticket/4196 С ним ничего не произошло за последние 8 месяцев.

Теперь, способ, которым вы спроектировали loadJquery, как я вижу, должен заменить $(document).ready(), так что вам не нужно беспокоиться. Но любой код, написанный в стиле $(document).ready(), не будет выполнен.

Answer 2

От публикации в наших внутренних списках рассылки на работе мне было указано на это:

Есть много кросс-браузерных краевых случаев, вовлеченных в динамически инъекционные скрипты. Если в ваш скрипт не добавлен файл с исходным кодом YUI 3 вариант, и если вы не можете зависеть от свойства, чтобы уже иметь YUI 3 загружен, я бы рекомендовал использовать LazyLoad (бесстыдный штекер) для загрузите ваш скрипт: http://github.com/rgrove/lazyload/

Вы можете объединить lazyload.js в ваш скрипт, а затем использовать что-то вроде этого загрузить YUI 3 seed, если его еще нет на странице:

(function () {
   function init() {
     YUI().use('node', function (Y) {
       // ... do my stuff ...
     });
   }

   if (YUI) {
     init();
   } else {
     LazyLoad.js('http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js',
init);
   }
})();

Answer 3

См. Мой ответ здесь о надежной асинхронной функции require (): Как включить файл JavaScript в другой файл JavaScript?

Answer 4

Если вы ищете стандартный способ, вместо того, чтобы придумать собственную реализацию, вы можете подумать:

• Google's google.load () для загрузки популярных библиотек
• CommonJS SecurableModules - см. Chiron Криса Ковала для реализации браузера.