При использовании API библиотек Google AJAX не удается вставить jQuery на страницу.

Я хотел бы добавить jQuery на страницу с помощью API библиотек Google AJAX. Я нашел следующее решение:

http://my-domain.com/inject-jquery.js:

;((function(){

  // Call this function once jQuery is available
  var func = function() {
    jQuery("body").prepend('<div>jQuery Rocks!</div>');
  };

  // Detect if page is already using jQuery
  if (!window.jQuery) {
    var done = false;
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement("script");
    script.src = "http://www.google.com/jsapi";
    script.onload = script.onreadystatechange = function(){

      // Once Google AJAX Libraries API is loaded ...
      if (!done && (!this.readyState || this.readyState == "loaded" || this.readyState == "complete")) {

        done = true;

        // ... load jQuery ...
        window.google.load("jquery", "1", {callback:function(){

          jQuery.noConflict();

          // ... jQuery available, fire function.
          func();
        }});

        // Prevent IE memory leaking
        script.onload = script.onreadystatechange = null;
        head.removeChild(script);
      }
    }

    // Load Google AJAX Libraries API
    head.appendChild(script);

  // Page already using jQuery, fire function
  } else {
    func();
  }
})());

Затем сценарий будет включен в страницу в отдельном домене:

http://some-other-domain.com/page.html:

<html>
  <head>
    <title>This is my page</title>
  </head>
  <body>
    <h1>This is my page.</h1>
    <script src="http://my-domain.com/inject-jquery.js"></script>
  </body>
</html>

В Firefox 3 я получаю следующую ошибку:

Module: 'jquery' must be loaded before DOM onLoad! jsapi (line 16)

Похоже, ошибка связана с API библиотек Google AJAX, поскольку я видел, как другие используют букмарклет jQuery для внедрения jQuery на текущую страницу. Мой вопрос:

  • Есть ли способ для внедрения API библиотек Google AJAX / jQuery на страницу независимо от состояния onload / onready?
Источник

4 ответа

Решение

Если вы делаете инъекцию, вероятно, проще запросить скрипт, не используя загрузчик Google:

(function() {
    var script = document.createElement("script");
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js";
    script.onload = script.onreadystatechange = function(){ /* your callback here */ };
    document.body.appendChild( script );
})()
Источник

Я нашел этот пост после того, как мы нашли другое решение. Так что по какой-то причине, если вы не можете использовать принятое решение, это, кажется, работает нормально:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
    if (typeof jQuery == 'undefined') {
        // jQuery hasn't been loaded... so let's write it into the head immediately.
        document.write('<script type="text/javascript" src="/jquery-1.3.2.min.js"><\/script>')
        }
</script>

Одна проблема с принятым решением заключается в том, что вы вынуждены поместить весь свой код, который вы хотите запустить на странице, в функцию обратного вызова. Поэтому все, что требует jQuery (например, плагины), должно вызываться из этой функции. И все остальные включенные вами JS-файлы, для которых требуется jQuery, зависят от загрузки jQuery ДО запуска всех остальных сценариев.

Источник

Вы можете использовать менее болезненное решение для внедрения jquery (самой последней стабильной версии из доступных) на любую страницу.

jQuerify - расширение Chrome, используемое для внедрения jQuery (последней доступной стабильной версии) в любую веб-страницу (даже HTTPS)"

Источник

Я получил это работает!!!!! Я понял это, посмотрев в игровую площадку приложения....

Вот обертка, чтобы начать использовать jquery.... Поместите предупреждение в функцию, чтобы увидеть, как она работает

google.load("jquery", "1.4.2");

function OnLoad(){
    $(function(){

    });
}

google.setOnLoadCallback(OnLoad);
Источник
Другие вопросы по тегам