動的

Question

私は例えば、動的にいくつかのjsファイルをロードしようとJavaScriptをロードする方法：

function openInforWindow(){ 
    //check if the InforWinow.js has been loaded or not 
    if(window.InforWindow){ 
    //do the right thing 
    } 
    else { 
    loadJs('xxxxxx/InforWindow.js'); 
    // do the right thing 
    //but here ,the infowindow is not definded yet. 
    } 
} 

function loadJs(filename){ 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", filename) 
    if (typeof fileref!="undefined") 
    document.getElementsByTagName("head")[0].appendChild(fileref) 
} 

がどのように動的にロードされているjsの中のvarまたは関数がJavaScriptの実行に追加することができることを確認します私はそれらを使用することができますか？

loadJs = function(src) { 
    var script = document.createElement('SCRIPT'); 
    script.setAttribute('src', src); 
    document.getElementsByTagName('HEAD')[0].appendChild(script); 
} 

が続いdocument.onloadイベントを待つ：

Answer 1

スクリプト要素の追加はブロック操作ではありません。つまり、外部スクリプトが読み込まれていない（解釈されていない）場合でも、loadJsメソッドがすぐに戻ります。あなたはそれが読み込まれるのを待たなければなりません。

function openInforWindow(){ 
    //check if the InforWinow.js has been loaded or not 
    if(window.InforWindow){ 
    //do the right thing 
    } 
    else { 
    var loadHandler = function() { 
     //do stuff with inforWindow 
    }; 

    loadJs('xxxxxx/InforWindow.js', loadHandler); 

    } 
} 

function loadJs(filename, handler){ 
    var fileref=document.createElement('script'); 
    fileref.setAttribute("type","text/javascript"); 
    fileref.setAttribute("src", "js"); 
    fileref.onreadystatechange = function() { 
    if (this.readyState == 'complete')handler(); 
    }; 
    fileref.onload = handler; 
    if (typeof fileref!="undefined") 
    document.getElementsByTagName("head")[0].appendChild(fileref); 
} 

Answer 2

あなたは動的ドキュメントに<script/>タグを挿入することができ、ここではFirefoxの/クロームで動作するスクリプトがある、あなたは、IEで微調整のビットを必要とするかもしれませんその段階であなたのwindow.InforWindowをロードする必要があります。 IEが若干異なる負荷のイベントリスナーを行い

document.addEventListener('load', function() { 
    // Your logic that uses window.InforWindow goes here 
}, false); 

注：

document.attachEvent('onload', function() { 
    // Your logic that uses window.InforWindow goes here 
}); 

Answer 3

一つのアプローチは、jQueryのAJAXローダーを使用してスクリプトをロードすることができます。以下の例：

function loadJs(filename, functionToCall){ 
    $.getScript(filename, functionToCall); 
} 

今、あなただけのloadJs("script.js", callback);を呼び出す必要があり、それが最初の完全script.jsをロードして、コールバックを実行します（）。