4

我想使用 Google AJAX Libraries API 将 jQuery 注入页面，我想出了以下解决方案：

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)

该错误似乎特定于 Google AJAX Libraries API，因为我看到其他人使用 jQuery 小书签将 jQuery 注入当前页面。我的问题：

  • 有没有一种方法可以将 Google AJAX 库 API / jQuery 注入页面而不管 onload/onready 状态如何？
4

4 回答 4

14

如果您正在注入，那么在不使用 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 );
})()
于 2009-05-08T16:06:55.307 回答
2

在我们找到不同的解决方案后，我发现了这篇文章。所以出于某种原因，如果你不能使用公认的解决方案，这个似乎工作正常：

<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（如插件）的东西都需要从该函数中调用。并且，所有其他需要 jQuery 的包含的 JS 文件都依赖于在所有其他脚本触发之前加载 jQuery。

于 2009-05-22T21:52:24.917 回答
1

我得到它的工作！！！！我通过查看应用程序游乐场想通了......

这是开始使用 jquery 的包装器.... 在函数中添加警报以查看它的工作情况

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

function OnLoad(){
    $(function(){

    });
}

google.setOnLoadCallback(OnLoad);
于 2010-05-18T04:03:47.443 回答
1

您可以使用不那么痛苦的解决方案将 jquery（可用的最新稳定版本）注入任何页面。

jQuerify - 用于将 jQuery（可用的最新稳定版本）注入任何网页（甚至是 HTTPS）的 Chrome 扩展程序”

于 2012-10-25T17:51:16.347 回答