[JavaScript] JSファイルやCSSファイルを遅延読込をする方法

方法

CSS

var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.href = "ファイル名.css";
document.head.appendChild(link);

JavaScript

var script = document.createElement("script");
script.async = true;
script.defer = true;
script.src = "ファイル名.js";
document.head.appendChild(script);

script 要素の async, defer の説明はこちらが分かりやすいかも。
→ HTML5 の script 要素で async, defer を使ってパフォーマンスアップ - IT-Walker on hatena
上記のスクリプトでは async と defer を同時に指定しています。その説明も

asyncとdeferを同時に指定すると、ブラウザasyncをサポートしているならその動作を、asyncをサポートしていないならdefer時の動作を行わせることが出来ます。asyncをサポートしていない古いブラウザ上でも、非同期でJavaScript実行されるように代替動作をさせることが出来る訳です。（ただし、読み込み中ページはブロックする）

引用元:『HTML5のscript要素でasync, deferを使ってパフォーマンスアップ - IT-Walker on hatena』より