AjaxでJavaScriptのファイルを取得する

jQueryのAjaxでJavaScriptのファイルを取得してみます。

サンプルコード

取得したJavaScriptファイルはそのまま実行されてしまうので、意図しない動作にならないよう注意が必要です。

HTML

<button id="get">script.jsを取得</button>
<button id="btn">script.js取得後にイベントが追加されるボタン</button>

JavaScript

$(function() {
	$('#get').on('click', function() {
		$.ajax({
			type : 'GET',
			url: 'script.js',
			dataType: 'script',
			success: function(data) {
				console.log(data);
			}
		});
	});
});

script.js(取得するファイル)

alert('読み込みました。');
$(function() {
	alert('$(fn)内');
	$('#btn').on('click', function() {
		alert('ボタンをクリックしました。');
	});
});

script.js内のalert()と#btnへのイベント追加が行われました。
AjaxでJavaScriptのファイルを取得するデモページ
 

【参考サイト】

 

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2021年9月
 1234
567891011
12131415161718
19202122232425
2627282930