2つのchromeユーザースクリプトにjQueryインスタンスを1つだけ使用するにはどうすればよいですか？私userscriptsで

Question

は、私はjQueryと私のコード注入され、実行の残りの部分を取得するには、このコードを使用します。

function addJQuery(callback) { 
    var script = document.createElement("script"); 
    script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"); 
    script.addEventListener('load', function() { 
    var script = document.createElement("script"); 
    script.textContent = "(" + callback.toString() + ")();"; 
    document.body.appendChild(script); 
    }, false); 
    document.body.appendChild(script); 
} 
function readyJQuery() { 
    jQuery.noConflict(); 
    jQuery(document).ready(function() { 
    //my rest code goes here 
    }) 
} 
addJQuery(readyJQuery) 

これは完璧に動作します。しかし、私は2つのスクリプトを持っているときに、両方ともjQueryの部分を注入します。私は誰がどのスクリプトか両方のスクリプトを使いたいのか分からないので、スクリプトは別々にする必要があります。

2番目のスクリプトのjQueryへの挿入を防止し、最初のスクリプトのスクリプトを使用できますか？私は、コンソールにエラーメッセージが表示されます

function addJQuery(callback) { 
    var script = document.createElement("script"); 
    script.textContent = "(" + callback.toString() + ")();"; 
    document.body.appendChild(script); 
} 
function readyJQuery() { 
    jQuery.noConflict(); 
    jQuery(document).ready(function() { 
    //my rest code goes here 
    }) 
} 
addJQuery(readyJQuery) 

：

は、2番目のスクリプトは、直接に起動するとjQuery is undefined。 別のスクリプトが既にjQueryを挿入しているかどうかをテストし、準備が整うまで待つことができますか？

Answer 1

jQueryに一意の識別子を付け、その識別子を確認し、jQueryが見つからない場合にのみ追加します。また、最初のjQueryを初期化するのに十分な時間が必要です。以下にaddJQuery()を変更

は、両方のスクリプトでは、私のテストで動作します。

function addJQuery (callback) { 
    //--- Has jQuery already been added? 
    var jqNode = document.querySelector ("#myAddedJQ"); 
    if (jqNode) { 
     FireCallback (callback); 
    } 
    else { 
     //--- Wait a bit to be sure. 
     setTimeout (function() { 
       var jqNode = document.querySelector ("#myAddedJQ"); 
       if (jqNode) { 
        FireCallback (callback); 
       } 
       else { 
        var script = document.createElement ("script"); 
        script.id = "myAddedJQ"; 
        script.setAttribute (
         "src", 
         "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" 
        ); 
        script.addEventListener ('load', function() { 
         FireCallback (callback); 
        }, false); 
        document.body.appendChild (script); 
       } 
      } 
      , 444 
     ); 
    } 

    function FireCallback (callback) { 
     var script   = document.createElement ("script"); 
     script.textContent = "           \ 
      if (typeof waitForJqDefined == 'undefined') {    \ 
       var waitForJqDefined = setInterval (function() { \ 
         if (typeof jQuery != 'undefined') {    \ 
          clearInterval (waitForJqDefined);   \ 
     "; 
     script.textContent += "\n(" + callback.toString() + ")();\n"; 
     script.textContent += "           \ 
         }            \ 
        },             \ 
        50             \ 
       );              \ 
      }               \ 
      else {              \ 
     "; 
     script.textContent += "\n(" + callback.toString() + ")();\n"; 
     script.textContent += "           \ 
      }               \ 
     "; 
     document.body.appendChild (script); 
    } 
} 

Answer 2

スクリプトを挿入してjQueryを読み込む前に、既に存在するかどうかを確認してください。

競合状態が心配な場合：両方のスクリプトが同時に競合状態を読み込もうとしている場合は、グローバルスコープにフラグを設定してその競合状態を絞り込み、それをチェックすることもできます。競合状態は削除されませんが、役立つ可能性があります。

if (typeof jQueryLoading == 'undefined') 
    var jQueryLoading = false; 
if (typeof jQuery == 'undefined' && jQueryLoading == false) 
{ 
    jQueryLoading = true; 
    //Load it yourself, then add scripts 
} 
else 
{ 
    //No problems. Add your scripts 
}