jQuery.getScript と同じことを素の Javascript でやる

2017年6月11日

jQuery の getScript は、なかなか独特な動作をする。

jQuery.getScript( 'http://example.com/test.js', callback );

例えば ↑ こう書くと

test.js を非同期で読み込んで実行
callback 関数を実行
test.js を DOM から削除

↑ こういう動作をする。

3. の部分がちょっと独特で、DOM から消えるので再利用はできないが、場面によっては結構便利に使える。

これを jQuery に頼らず、ネイティブな素の Javascript（いわゆる Vanilla JS）で出来ないかなー？
と思って探してたら、Stack Overflow にあった。

jQuery.getScript alternative in native JavaScript - Stack Overflow

I'm trying to load JS scripts dynamically, but using jQuery is not an option. I ch ...

https://stackoverflow.com/questions/16839698/jquery-getscrip...

function getScript(source, callback) {
	var script = document.createElement('script');
	var prior = document.getElementsByTagName('script')[0];
	script.async = 1;

	script.onload = script.onreadystatechange = function( _, isAbort ) {
		if(isAbort || !script.readyState || /loaded|complete/.test(script.readyState) ) {
			script.onload = script.onreadystatechange = null;
			script = undefined;

			if(!isAbort) { if(callback) callback(); }
		}
	};

	script.src = source;
	prior.parentNode.insertBefore(script, prior);
}

これ、すげぇｗ

今度、getScript が必要になったら、これ使う。