1

私はこのコードを持っています:

function init(){
    if (typeof window.jQuery !== 'function') {
        var link = document.createElement('script');
        link.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
        document.getElementsByTagName('head')[0].appendChild(link);
    }
}

window.onload = init;

 if (typeof window.jQuery === 'function')  {
    $(document).ready(function(){
        alert(1);
    });
}

私がやろうとしているのは、jQueryが存在しない場合にjqueryスクリプトのリンクを頭に追加してからコードを実行することです。最善の方法は、jquery がヘッドに存在するかどうかをできるだけ早く確認してから、ソースへのリンクを追加することです。しかし、私はそうする方法を知りませんか?

更新: 別のアプローチは、関数を使用することです:

  function init(){
   if (typeof window.jQuery !== 'function') {
      var link = document.createElement('script');
      link.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
      document.getElementsByTagName('head')[0].appendChild(link);
      start_code();
   }
   else{
       start_code();
   }
}  
window.onload = init;
function start_code(){
           $(document).ready(function(){
                alert(1);
           });
     }

基本的に、すべてがロードされた後に関数を呼び出すことができます..しかし、これはうまくいきません。$ is not defined エラーがスローされている原因

4

1 に答える 1

3
function init(){
   if (typeof window.jQuery !== 'function') {
      var link = document.createElement('script');
      link.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
      document.getElementsByTagName('head')[0].appendChild(link);
   }
}

またはHTML5 boilerplateアプローチを使用する

<script>window.jQuery || document.write('<script src="/js/vendor/jquery-1.7.2.min.js"><\/script>')</script>

このスクリプトをページの下部に配置します (パフォーマンス上の理由から)。次に、以前に jQuery 関数を使用する必要がある場合は、このリソースをご覧ください: jQuery 税の支払いを停止する

document.writeここではスクリプトブロック(同期) を作成しているため、必要なことは単純です。

<script>window.jQuery || document.write('<script src="/js/vendor/jquery-1.7.2.min.js"><\/script>')</script>
<script>
    $(document).ready(function(){
        alert(1);
    });
</script>
于 2012-07-03T07:47:46.653 に答える