Webサイトによっては、ユーザーのデバイスによって表示するものを変えることがあります。 最近ではCSSを使ってデバイスに応じたコンテンツを表示しています。 CSSではメディアクエリを使ってデバイスの画面幅で判断していますが、例えば「画面幅が1200px以上だったらデスクトップパソコンのモニターだと考えてデスクトップパソコン用のバナーを、1200px未満であればタブレットやスマートフォン用のバナーを表示させる」という設定をします。 しかし、CSSでは画面幅以外で判定を行うことはできないため、画面幅が同じデスクトップのモニターとタブレットを区別することができません。 この場合、どうすればよいのでしょうか? ユーザーが使用しているデバイスに応じて表示内容を変えたい場合は、JavaScript を使い、表示を切り替える方法があります。 今回はユーザーエージェントの情報を使い、JavaScriptで