4

JavaScript (.js) ファイルを親 JavaScript コードに動的にインポートする正しい方法は何ですか?

次のコードを使用していますが、正しくないようです。

    function loadjscssfile(filename, filetype)
{
    //if filename is a external JavaScript file
    if (filetype=="js")
    {
        var fileref=document.createElement('script');
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filename);
    }
    //if filename is an external CSS file
    else if (filetype=="css")
    {
        var fileref=document.createElement("link");
        fileref.setAttribute("rel", "stylesheet");
        fileref.setAttribute("type", "text/css");
        fileref.setAttribute("href", filename);
    }
    if (typeof fileref!="undefined")
    document.getElementsByTagName("head")[0].appendChild(fileref)
}

マスターJavaScriptコードでは、インポートされたコードで定義された次のような変数を読み取ることができないため、コードは正しくないと思います。

var fileRef = loadjscssfile('Language/svk.js', 'js');
alert("Pet Name: " + PETNAME);

インポートされた svk.js ファイルには、次のコードのみが含まれています。

// JavaScript Document
var PETNAME = "Beauty";

ありがとうございました。

4

3 に答える 3

4

タグを挿入した直後に、外部 JS ファイルで定義された変数と関数を使用することはできません<script>。ブラウザがファイルを読み込んで実行するのに数ミリ秒かかります。

JavaScript を適切な順序でロードするには、何らかのコールバックを使用する必要があります。

JavaScript の適切な条件付き読み込みについては、Require.jsを参照してください。そこに非同期モジュール定義パターンが実装されています。

于 2012-06-02T18:11:04.367 に答える
3

以下svk.jsを追加します (可変減速の後):

svkLoaded();

マスター コード ファイルに次を追加します。

function svkLoaded()
{
    alert("Pet Name: " + PETNAME);
}
于 2012-06-02T18:19:19.923 に答える
2

変数を読み取ることができない理由PETNAMEは、このようなスクリプトを動的に挿入することは非同期で非ブロックであるためです。これはalert、スクリプトが実際にロードされる前に実行されることを意味します。PETNAME代わりに、変数の存在をポーリングする必要がある場合があります。

var waitForPETNAME = function(){
        if (typeof PETNAME === 'undefined') {
            setTimeout(waitForPETNAME, 15);
        } else {
            // execute code that uses PETNAME
        }
    };

waitForPETNAME();

また、要素を動的に挿入するより確実な方法は、最初のスクリプト要素の前に要素を挿入することです。これは、スクリプト要素が存在する必要があることが確実にわかっているためです (そうしないと、コードを実行できません)。つまり、次のように置き換えます。

document.getElementsByTagName("head")[0].appendChild(fileref)

と：

var insref = document.getElementsByTagName('script')[0];
insref.parentNode.insertBefore(fileref, insref);
于 2012-06-02T18:12:01.417 に答える