http://test.com/aaaa/test.jsの中身は単なる
alert(test_ok);
しか記述がないです。
aaa.jsの中身は
deferLoader('http://test.com/aaaa/test.js');
function deferLoader(filepath,callback){
var sc = document.createElement('script');
sc.setAttribute('defer', true);
sc.type = 'text/javascript';
window.external_script_onload = filepath;
sc.src = filepath;
document.body.appendChild(sc);
}
ただし、IE7で実行すると、上手く行きません。
ブラウザがすぐビジー状態になってしまう。
ついでに、window.external_script_onload
ってどういううごきなんですかね?
以下のページを参考にしているのですが
いまいちわかりません。
http://d.hatena.ne.jp/os0x/20080827/1219815828
まずご理解されているかと思いますがexternal_script_onloadはid:os0xさんが決めた特定のコールバック名であって、windowオブジェクトに用意されたプロパティや関数ではありません。
実際に http://ss-o.net/js/callback_test.php にアクセスしてみると分かる通り、宣言されていれば外部からでもJSONP的に呼び出すよ!という仕組みでしかありません。
ちなみにexternal_script_onloadはcallbackを設定するのであって、filepathを指定する物ではありません。
※ビジー状態になっている原因は他にあるかと思います。
ですので、勝手にやりたいだろう事を推測させて頂くとすると
function deferLoader(filepath,callback){ var sc = document.createElement('script'); sc.setAttribute('defer', true); sc.type = 'text/javascript'; window.external_script_onload = callback; sc.src = filepath; document.body.appendChild(sc); } deferLoader('http://test.com/aaaa/test.js', function(data) { alert(data); // loaded });
alert('test ok'); if(typeof external_script_onload=='function')external_script_onload("loaded");
となります。元々は外部javascriptのロード完了を判断するのにid:amachangがタイマを使ってロードされたオブジェクトを監視していたのに対して、id:os0xさんが読み込み対象のスクリプトを少し弄ればロード完了イベントを受け取れるよ...と記事にした物かと思います。
私が一番良いんじゃないかな...と思ったのはid:os0xさんの記事にあるJavaScriptLoader
function JavaScriptLoader(src, callback){ var sc = document.createElement('script'); sc.type = 'text/javascript'; if (window.ActiveXObject) { sc.onreadystatechange = function(){ if (sc.readyState == 'complete') callback(sc.readyState); if (sc.readyState == 'loaded') callback(sc.readyState); }; } else { sc.onload = function(){ callback('onload'); }; } sc.src = src; document.body.appendChild(sc); }
がクロスブラウザかつ読み込み対象を修正しなくて良いという点で一番利用価値があると思います。
HTMLのドキュメントが読み込まれていない間にJavaScriptLoaderを呼び出した...という事はないですか?
ちなみに私の環境IE7だとうまく動いています。
<html> <head> <script type="text/javascript"> function JavaScriptLoader(src, callback){ var sc = document.createElement('script'); sc.type = 'text/javascript'; if (window.ActiveXObject) { sc.onreadystatechange = function(){ if (sc.readyState == 'complete') callback(sc.readyState); if (sc.readyState == 'loaded') callback(sc.readyState); }; } else { sc.onload = function(){ callback('onload'); }; } sc.src = src; document.body.appendChild(sc); } window.onload = function() { JavaScriptLoader('foo.js', function() { alert('foo.jsが読み込まれました。'); alert(window.foo); // hello world }); } </script> </head> </html>
window.foo = "hello world";
window.onload = function() {
}
これだ・・
もっと詳細に提示しなくてすいません。
まず、AJAXでjsを使うHTMLをPHP側で、file_get_contentsします。
で、その後、その内容をinnerHTMLで返した後に、JSの中で
JavaScriptLoaderを実行しているので
読み込んだかどうかの判定が出来ないのかな・・
AJAX部分を一番下で実行すればいいんかな・
ちょっとやってみます。
色々、ありがとうございます。
最後に一点だけ教えて欲しいのですが、jsファイルを複数読み込みたい場合は
どうしたらいいでしょうかね?
srcの引き数を複数で、callbackはひとつにしたいのですが・・
JavaScriptLoaderを使ってみたのですが
IEだと、ページを中断しますみたいな
メッセージがあがってきてしまいます・・・
なんでだろう・・