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 を挿入するのを見たことがあります。私の質問：

  • onload/onready 状態に関係なく、Google AJAX Libraries API / jQuery をページに挿入する方法はありますか?
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>

受け入れられているソリューションの問題の1つは、ページで実行するすべてのコードをコールバック関数に配置する必要があることです。したがって、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 (利用可能な最新の安定バージョン) を任意の Web ページ (HTTPS を含む) に挿入するために使用される Chrome 拡張機能"

于 2012-10-25T17:51:16.347 に答える