Login Form

アクセス解析

Home 管理者のブログ JavaScriptファイルの動的ロード方法
JavaScript 第5版
JavaScriptファイルの動的ロード方法
著者: システム管理者
2010年 4月 22日(木曜日) 15:59
PDF 印刷 メール
【概要】
JavaScriptファイルを動的にローディングする方法を掲載しております。
この方法は、Ajaxで非同期にコンテンツを読み込む際に有効な方法です。
【説明】
関数（外部ファイルタイプ） 
//
//
//パラメタ
//    src ... 読み込み対象JavaScriptファイル名称
//    callback ... 読み込み完了通知コールバック関数
//                     callback関数には、引数として readyStateが渡されます。
function insScriptFileLoader( src, callback )
{
	var script = document.createElement( 'script' );
	script.type = 'text/javascript';
	if( window.ActiveXObject )
	{
		script.onreadystatechange = function() {
			if(
				( script.readyState == 'complete' )
				||
				( script.readyState == 'loaded' )
			)
			{
				callback( script.readyState );
			}
		};
	} else {
		script.onload = function()
		{
			callback( 'onload' );
		};
	}
	script.src = src;
	document.body.appendChild( script );
}
//
//
//
関数（コード指定タイプ） 
//
//
//パラメタ
//    code ... 読み込み対象JavaScriptコード
//    callback ... 読み込み完了通知コールバック関数
//                     callback関数には、引数として readyStateが渡されます。
function insScriptCodeLoader( code, callback )
{
	var script = document.createElement( 'script' );
	script.type = 'text/javascript';
	if( window.ActiveXObject )
	{
		script.onreadystatechange = function() {
			if(
				( script.readyState == 'complete' )
				||
				( script.readyState == 'loaded' )
			)
			{
				callback( script.readyState );
			}
		};
	} else {
		script.onload = function()
		{
			callback( 'onload' );
		};
	}
	script.text = code;
	document.body.appendChild( script );
}
//
//
//
【注意事項】
本関数だけでなく、動的にロードされキャッシュされていないJavaScriptファイルのロード完了時には readyStateは complete ではなく、loaded になることに注意が必要です。
また、IEのメモリリークには、「IEのメモリリーク対策」対策をご確認下さい。

コメント投稿

お名前:
メールアドレス:
タイトル:
コメント:
＊如何なるコメントであっても、その著作権は弊社に帰属するものとさせて頂きます。
yvComment v.1.24.0
< 戻る   次 >
最終更新 ( 2010年 4月 29日(木曜日) 17:40 )