How to detect the device is an Android device using JavaScript ?

31 Jul, 2019
The task is to detect a device, whether the device is Android Phone or not using JavaScript.
Approach 1:
Use navigator.userAgent property to get the value of the user-agent header sent by the browser to the server.
Check the index of ‘android’ in the userAgent.
If the index is greater then -1 then it is android phone else not android phone.
Example: This example checks whether the device is android phone or not.
<!DOCTYPE HTML> <html>   <head>     <title>         How to detect Android Phone        using JavaScript ?    </title></head>   <body style = "text-align:center;">       <h1 style = "color:green;" >         GeeksForGeeks    </h1>      <p id = "GFG_UP" style =        "font-size: 19px; font-weight: bold;">    </p>          <button onclick = "GFG_Fun()">        click here    </button>          <p id = "GFG_DOWN" style =        "color: green; font-size: 24px; font-weight: bold;">    </p>          <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        el_up.innerHTML = "Click on the button to detect if"                    + " the device is android phone.";                  function GFG_Fun() {            var res = "Device is not Android Phone";            var userAgent = navigator.userAgent.toLowerCase();            var Android = userAgent.indexOf("android") > -1;                          if(Android) {                res = "Device is Android Phone";            }            el_down.innerHTML = res;        }    </script> </body>   </html>
Output:
Before Clicking the Button:
Run on Computer and Click the Button:
Run on Android Mobile and Click the Button:
Approach 2:
Get the navigator.userAgent Property in a variable name userAgent.
Check for the ‘android’ in the userAgent by using RegExp
If the value of Android is not 0 then it is android phone else not android phone.
Example:
<!DOCTYPE HTML> <html>   <head>     <title>         How to detect Android Phone        using JavaScript ?    </title></head>   <body style = "text-align:center;">           <h1 style = "color:green;" >         GeeksForGeeks    </h1>          <p id = "GFG_UP" style =        "font-size: 19px; font-weight: bold;">    </p>          <button onclick = "GFG_Fun()">        click here    </button>          <p id = "GFG_DOWN" style =        "color: green; font-size: 24px; font-weight: bold;">    </p>          <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        el_up.innerHTML = "Click on the button to detect if"                + " the device is android phone.";                  function GFG_Fun() {            var res = "Device is not Android Phone";            var Android = /(android)/i.test(navigator.userAgent);                          if(Android) {                res = "Device is Android Phone";            }                          el_down.innerHTML = res;        }    </script> </body>   </html>
Output:
Before Clicking the Button:
Run on Computer and Click the Button:
Run on Android Mobile and Click the Button:
JavaScript-Misc
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
Remove elements from a JavaScript Array
Difference Between PUT and PATCH Request
How to append HTML code to a div using JavaScript ?
Installation of Node.js on Linux
Top 10 Projects For Beginners To Practice HTML and CSS Skills
Difference between var, let and const keywords in JavaScript
How to insert spaces/tabs in text using HTML/CSS?
How to fetch data from an API in ReactJS ?