JavaScriptでスマホ・タブレット判定

公開日:2021年09月29日更新日:2023年01月29日

JavaScript

「navigator.userAgent」を使用してユーザーエージェント情報を取得して判定します。

※Chromeのユーザーエージェント廃止情報あり
https://developer.chrome.com/ja/blog/user-agent-reduction-oct-2022-updates/

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JavaScriptでスマホ・タブレット判定</title>
</head>
<body>
  <h1>JavaScriptでスマホ・タブレット判定</h1>
  <script>
    const ua = navigator.userAgent;
    const is_sp = (
      ua.indexOf('iPhone') > -1 ||
      (ua.indexOf('Android') > -1 && ua.indexOf('Mobile') > -1)
    );
    const is_tab = (
      ua.indexOf('iPad') > -1 ||
      (ua.indexOf('Android') > -1 && ua.indexOf('Mobile') == -1)
    );
    const is_pc = (!is_sp && !is_tab);
    console.log(ua);
    console.log(is_sp);
    console.log(is_tab);
    console.log(is_pc);
  </script>
</body>
</html>

コンテンツ一覧

同じカテゴリーのコンテンツ