The task is to detect the android version of the user with the help of JavaScript.
Two approaches are discussed here, first example uses the RegExp and second uses indexOf method to search the keyword ‘android’.
Note: Both codes will only works when you run them on android devices.
Approach 1: In this approach, we will use navigator.useragent property, which returns the value of the user-agent header sent by the browser to the server. It contains information about the name, version and platform of the browser. Then we need to search the keyword ‘android’ in the string returned and get the value in temp array(which contains the version) to do that we will use a RegExp. If the temp is not null then the value at index 0 is the answer else undefined.
Example: This example implements the above approach.
html
<head> <script src= </script> <style> body { text-align: center; } h1 { color: green; } .gfg { font-size: 20px; font-weight: bold; } #neveropen { font-size: 24px; font-weight: bold; color: green; } </style> </head> <body> <h1> GeeksForGeeks </h1> <p class="gfg"> Click on the button to get the android version of the user. </p> <button onclick="GFG_Fun()"> click here </button> <p id="neveropen"> </p> <script> var element = document.getElementById("body"); function androidV(ua) { ua = (ua || navigator.userAgent).toLowerCase(); var match = ua.match(/android\s([0-9\.]*)/i); return match ? match[1] : undefined; }; function GFG_Fun() { $('#neveropen').html(androidV()); } </script> </body> |
Output:
Approach 2 In this approach, we will use navigator.useragent property, which returns the value of the user-agent header sent by the browser to the server. It contains information about the name, version, and platform of the browser. Then we need to search if the ‘android’ keyword is present in the string or not to do that we will use indexOf. If it is present then get the version that is just after the keyword ‘android’ by using .slice() and indexOf.
Example: This example implements the above approach.
html
<head> <script src= </script> <style> body { text-align: center; } h1 { color: green; } .gfg { font-size: 20px; font-weight: bold; } #neveropen { font-size: 24px; font-weight: bold; color: green; } </style> </head> <body> <h1> GeeksForGeeks </h1> <p class="gfg"> Click on the button to get the android version of the user. </p> <button onclick="GFG_Fun()"> click here </button> <p id="neveropen"> </p> <script> var element = document.getElementById("body"); function GFG_Fun() { var androidV = null; var ua = navigator.userAgent; if (ua.indexOf("Android") >= 0) { androidV = parseFloat(ua.slice(ua.indexOf("Android") + 8)); } $('#neveropen').html(androidV); } </script> </body> |
Output: