How to detect the user's device using jQuery ?

Last Updated : 24 Jun, 2019
Comments
Improve
Suggest changes
Like Article
Like
Report
The task is to determine the user's device, whether it is iPad or not, using JQuery. Below are the required methods:
  • Navigator userAgent Property: This property returns the value of the header of user-agent which is sent by the browser to the server. Returned value, have information like name, version, and platform of the browser. Syntax: 
    navigator.userAgent
    Return value: It returns a string, which represents the user agent string of the current browser.
Example: This example uses the navigator.userAgent property to identify the user's device. html 
<!DOCTYPE HTML>
<html>

<head>
    <title>
        JQuery 
      | Detect iPad users.
    </title>
</head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>

<body style="text-align:center;" 
      id="body">
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP" 
       style="font-size: 17px; 
              font-weight: bold;">
    </p>
    <button>
        click here
    </button>
    <p id="GFG_DOWN" 
       style="color: green; 
              font-size: 24px; 
              font-weight: bold;">
    </p>
    <script>
        $('#GFG_UP').text(
          "Click on the button to see "+
          "whether user's device is iPad or not");
      
        $('button').on('click', function() {
            var is_iPad = 
                navigator.userAgent.match(/iPad/i) != null;
            $('#GFG_DOWN').text(is_iPad);
        });
    </script>
</body>

</html>
Output:
  • Before reaching the bottom:
  • After reaching the bottom:

Next Article
How to detect touch screen device using CSS ?

P
PranchalKatiyar
Improve
Article Tags :

Similar Reads