JavaScriptでユーザーエージェントを判別しよう!

こんにちは、けーすけです。
現在リニューアル真っ最中で、WordPressの中をごちゃごちゃといじってます。リニューアルってほんと大変ですね、、、、、
さて!今回は表題の通り、JavaScriptでユーザーエージェントを判別していきたいと思います。
ユーザーエージェントとは、ユーザーがアクセスしている端末の種類です。iPhoneなのか、Androidなのか、iPadなのか、、、とかですね!UAと略して表記されることもしばしば。
コピペで使えるのでおすすめです!

ユーザーエージェントを判別しよう!

今回のソースはこちら。ソースが長くなりすぎるので、今回はよく使うスマホの判別のみ記載しています。
[codepen_embed height=”265″ theme_id=”0″ slug_hash=”oWNVPb” default_tab=”js” user=”Chankei”]See the Pen <a href=’http://codepen.io/Chankei/pen/oWNVPb/’>text background-clip</a> by Chankei (<a href=’http://codepen.io/Chankei’>@Chankei</a>) on <a href=’http://codepen.io’>CodePen</a>.[/codepen_embed]
 
navigator.useragentの記述でユーザーの端末を取得しています。
そして、toLowerCase()で取得した文字列をすべて小文字にしています。こうすると比較がしやすくなります。
indexOf()で文字列の有無を、「 0 」以上か「  -1 」に変換して代入します。
最後にif文で比較しておしまい!
はい!簡単ですね!
もっとコードを短くすることができるので使う際は、しっかり書いてみてください。

まとめ

今回は短いですがこの辺で。
CodePenの不具合と戦っているといつの間にかこんな時間です。。。
 
それでは今回はこの辺で、けーすけでした。