ソースコード : Source
switch(document.readyState){
case 'complete':
case 'interactive':
new Run()
break
default:
window.addEventListener('load' , (()=>{new Run()}).bind(this))
break
}
解説 : Comment
Javascriptで、ページ内の要素を操作する場合、headタグ内に操作をするscriptタグを書くと、ページのloadを待ってから処理を開始する必要があります。
もし、ページのloadを待たずに要素を操作しようとしたら、まだDOMで読み込まれていないため、処理が行われないだけじゃなく、エラーなどにも繋がります。
また、scriptタグが、操作をするタグよりも上（手前）に書かれている場合でも同じ状態になります。
すべてのscriptタグは、bodyタグの閉じタグ直前に書けば問題はなくなりますが、SEO的には、headタグに、scriptタグを書くのがセオリーです。
こうした事態を回避するために、Dom操作を行う処理のjavascriptの読み込みをページ内のどこにscriptタグを書き込んでも、ページloadを判別して処理を実行してくれるスニペットソースです。
サンプルでは、Runというクラスを起動していますが、任意関数を実行する処理に書き換えて使ってもらっても全く問題有りません。
すべての処理の開始を関数化しておき、このソースを実行してから処理をスタートすれば、ページの読み込みを考える必要もないので、おまじないのように記述してもらっても構いません。