【Javascript】スマホ・タブレット・PCをユーザーエージェント判定で判別する方法

「このJavascriptの指定はPCの場合のみ利用できるようにしたい。」、「この指定はスマートフォンでのみ使用できるようにした。」など、スマートフォン、タブレット、PC、それぞれの端末に対して実行するJavascriptを限定したり、変更していといったことがよくあると思います。
そこで、今回はJavascriptを使って、ユーザーエージェントを判別し、スマートフォン、タブレット、PC、それぞれに条件分岐して、Javascriptを指定する方法をご紹介いたします。

スマートフォン・タブレット・PCそれぞれに条件分岐する方法

スマートフォン・タブレット・PCそれぞれに条件分岐する場合は次のように指定します。

iPhone・Androidなどのユーザーエージェントをそれぞれ判別し、論理演算子or「||」でつなげて条件を作ります。Androidスマートフォンに関しては、論理演算子and「&&」を使ってnavigator.userAgent.indexOf(‘Android’) > 0 && navigator.userAgent.indexOf(‘Mobile’) > 0と記述することで、対応できます。navigator.userAgent.indexOf(‘Android’) > 0だけではAndroidタブレットを判定するユーザーエージェントの意味になります。

スマートフォン・タブレットとPCを別ける場合は次のような記述になります。

 
スマートフォンのみに適応する場合

 
タブレットのみに適応する場合

PCのみに適応する場合の記述方法

PCのみに適応する場合は、論理演算子not「!」を使います。これを使うことで、スマートフォン・タブレットではない時、という意味になり、PCのみに適応されるようになります。