Detectar un dispositivo es iOS o no usa JavaScript

Para detectar un dispositivo si es iOS o no. Vamos a la plataforma Navigator y a la propiedad userAgent de Navigator .

  • Propiedad Navigator userAgent
    Esta propiedad devuelve el valor del encabezado del agente de usuario que envía el navegador al servidor.
    Valor devuelto, tiene información sobre el nombre, la versión y la plataforma del navegador.
    Sintaxis:
    navigator.userAgent
    

    Valor de retorno:
    Devuelve una string, que indica la string de agente de usuario para el navegador de trabajo actual.

  • Propiedad de la plataforma del navegador
    Esta propiedad devuelve la plataforma para la que se compila el navegador.
    Sintaxis:
    navigator.platform
    

    Valor de retorno:
    Devuelve una string, que representa la plataforma del navegador.
    Valores posibles.

    • HP-UX
    • linux i686
    • linux armv7l
    • Mac68K
    • MacPPC
    • Sun OS
    • Win32
    • Etc.

Ejemplo 1: este ejemplo detecta el dispositivo mediante la propiedad (navigator.userAgent) y devuelve false .

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        JavaScript 
      | Detecting a device is iOS.
    </title>
</head>
  
<body style="text-align:center;"
      id="body">
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP" 
       style="font-size: 15px; 
              font-weight: bold;"> 
      Detecting whether a device is iOS.
    </p>
    <button onclick="gfg_Run()">
        detect
    </button>
    <p id="GFG_DOWN"
       style="color:green; 
              font-size: 23px;
              font-weight: bold;">
    </p>
    <script>
        var el_down = 
            document.getElementById("GFG_DOWN");
  
        function gfg_Run() {
            var iOS = 
                /iPad|iPhone|iPod/.test(navigator.userAgent) &&
                !window.MSStream;
            el_down.innerHTML = iOS;
        }
    </script>
</body>
  
</html>

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Ejemplo 2: este ejemplo detecta el dispositivo mediante la propiedad (navigator.platform) y devuelve true .

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        JavaScript 
      | Detecting a device is iOS.
    </title>
</head>
  
<body style="text-align:center;" 
      id="body">
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP" 
       style="font-size: 15px; font-weight: bold;">
      Detecting whether a device is iOS.
    </p>
    <button onclick="gfg_Run()">
        detect
    </button>
    <p id="GFG_DOWN" 
       style="color:green; 
              font-size: 23px; 
              font-weight: bold;">
    </p>
    <script>
        var el_down = 
            document.getElementById("GFG_DOWN");
  
        function gfg_Run() {
            var iOS = 
                !!navigator.platform &&
                /iPad|iPhone|iPod/.test(navigator.platform);
            el_down.innerHTML = iOS;
        }
    </script>
</body>
  
</html>

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Ejemplo 3: este ejemplo detecta el dispositivo mediante la propiedad (navigator.platform) y devuelve false .

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        JavaScript 
      | Detecting a device is iOS.
    </title>
</head>
  
<body style="text-align:center;" 
      id="body">
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP" 
       style="font-size: 15px; 
              font-weight: bold;">
      Detecting whether a device is iOS.
    </p>
    <button onclick="gfg_Run()">
        detect
    </button>
    <p id="GFG_DOWN" 
       style="color:green;
              font-size: 23px; 
              font-weight: bold;">
    </p>
    <script>
        var el_down = document.getElementById("GFG_DOWN");
  
        function gfg_Run() {
            var iOS = 
                !!navigator.platform && 
                /iPad|iPhone|iPod/.test(navigator.platform);
            el_down.innerHTML = iOS;
        }
    </script>
</body>
  
</html>

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *