外部JSを読み込むときにどうしてもdocument.writeで読み込まなければならないけどうまくいかないとき


まず、タイトルが長い。
タイトル通りだが、サイトの作りによってはクライアントの要望によってPCに偏ったアニメーションごりごりのサイトを作る場合がある。

サイト全体としてResponsiveで作る前提なのでviewportでJSを分けるのも負荷が高いので、CSSとJSをUserAgentで分けてしまおうと。

その時点でResponsiveじゃないというのは言わないでおきます。

普通に考えて、以下のように設定するかと思われる。
<script>
document.write(‘<link href=”○○○.css” rel=”***” type=”***” /> ‘);
document.write(‘<script src=”○○○.css” ></script> ‘);
</script>

でもこれだとCSSの方は上手くいくけど、JSの方だけなぜか’);が無視されて変なところまでwriteしにいく。

ブラウザのバグらしく、解決策は簡単。

document.write(‘<script src=”○○○.css” ></scri’ + ‘pt> ‘);

と分けちゃえば大丈夫みたい。

若干ハマりました。
以下、参考にさせていただいたサイト。ありがとうございました!

http://vip-audio.jugem.jp/?eid=87