スマートフォンやタブレットでのアクセス時に異なるcssを読み込ませるシーンはよくありますが、
異なるjavascriptを読み込ませることもあると思います。
UA判別でjavascriptファイルを変えようとサクッと下記を記述したところ、
<script> (function(){ var _UA = navigator.userAgent; if (_UA.indexOf('iPhone') > 0 || _UA.indexOf('iPod') > 0 || _UA.indexOf('Android') > 0) { document.write('<script type="text/javascript" src="/js/sp.js"></script>'); }else{ document.write('<script type="text/javascript" src="/js/pc.js"></script>'); } })(); </script>
ブラウザで確認すると「’);}」の文字が出ている…
何かのタグの閉じ忘れか表記ミスか?と疑いましたが、
そもそも
<script>~</script>
で囲まれたコードなので、
その中に
<script type="text/javascript" src="/js/sp.js"></script>
こんな記述があれば、親コードとソース指定の閉じタグを混同し、
当然解釈はおかしくなります。
というわけで、
「document.write」部、javascriptソース記述の閉じタグの/を半角の¥マークでエスケープし、文字列として認識させます。
<script> (function(){ var _UA = navigator.userAgent; if (_UA.indexOf('iPhone') > 0 || _UA.indexOf('iPod') > 0 || _UA.indexOf('Android') > 0) { document.write('<script type="text/javascript" src="/js/sp.js"><¥/script>'); }else{ document.write('<script type="text/javascript" src="/js/pc.js"><¥/script>'); } })(); </script>
※上記コードは全角の¥で記載していますが、実際には半角を使用します。
プログラミングに慣れていれば陥らないミスですが、
念のため備忘録として…