2015年11月12日木曜日

JavaScriptで他のファイルをincludeする2


前回、JavaScriptで他のファイルをincludeする方法について簡単に書きました。
しかし、前回の方法では複数のファイルにinclude関数が宣言されていた、以下のように同じファイル名がある場合に多重にファイルをincludeしてしまいあまり実用的ではありません。

include("test.js");
include("test.js");

そこで、今回は前回の関数をすこし修正し、これらの問題を解決した完成版のinclude関数を作ります。



main.js
------------------------------------
if(typeof(include)=="undefined"){include_list={};include=function(src){
    var xhr=null;if(include_list[src])return;include_list[src]=1;
    if (window.XMLHttpRequest)xhr=new XMLHttpRequest();
    else if(window.ActiveXObject)try {
        xhr=new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){xhr=new ActiveXObject("Microsoft.XMLHTTP");}
    xhr.open("GET",src,false);xhr.send("");(0,eval)(xhr.responseText);
}}
//↑include関数を使うすべてのjsファイルの先頭に入れる

include("test.js");
println("test.js include OK");
------------------------------------


test.js
------------------------------------
if(typeof(include)=="undefined"){include_list={};include=function(src){
    var xhr=null;if(include_list[src])return;include_list[src]=1;
    if (window.XMLHttpRequest)xhr=new XMLHttpRequest();
    else if(window.ActiveXObject)try {
        xhr=new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){xhr=new ActiveXObject("Microsoft.XMLHTTP");}
    xhr.open("GET",src,false);xhr.send("");(0,eval)(xhr.responseText);
}}
//↑include関数を使うすべてのjsファイルの先頭に入れる

include("jquery-1.11.3.js");

println=function(src)
{
 alert(src);
}


jQuery().ready(function()
{
 println("jQuery OK");
}

------------------------------------


こんな感じです。
これでどんな順番にファイルをincludeしても正しく動きます。
ちなみにこの方法はjQueryも動的にincludeできます。
これであこがのJavaScriptファイルを分割してみんなで作業できる。



0 件のコメント:

コメントを投稿