How to detect the user's device using jQuery ?

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.

<!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:

My Personal Notes

How to detect the user’s device using jQuery ?

Recommended Posts: