The task is detect the operating system of User with the help of JavaScript. we’re going to discuss few techniques.
Approach:
- Access the navigator.appVersion or navigator.userAgent property.
- Get the index of the OS using indexOf() method.
- If index is other than -1, then it is the OS, that we are looking for.
Example 1: In this example, navigator.appVersion property is used to get the OS.
<!DOCTYPE HTML> <html>
<head>
<title>
JavaScript
| Detecting the Operating System of User.
</title>
</head>
<body style="text-align:center;" id="body">
<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>
HTMLDocument.prototype.e = document.getElementById;
var el_up = document.e("GFG_UP");
var el_down = document.e("GFG_DOWN");
el_up.innerHTML = "Click on the button to get the OS of User's System.";
var Name = "Not known";
if (navigator.appVersion.indexOf("Win") != -1) Name =
"Windows OS";
if (navigator.appVersion.indexOf("Mac") != -1) Name =
"MacOS";
if (navigator.appVersion.indexOf("X11") != -1) Name =
"UNIX OS";
if (navigator.appVersion.indexOf("Linux") != -1) Name =
"Linux OS";
function GFG_Fun() {
el_down.innerHTML = Name;
}
</script>
</body>
</html>
|
Output:
-
Before clicking on the button:
-
After clicking on the button:
Example 2: In this example, navigator.userAgent property is used to get the OS.
<!DOCTYPE HTML> <html>
<head>
<title>
JavaScript
| Detecting the Operating System of User.
</title>
</head>
<body style="text-align:center;" id="body">
<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 get the OS of User's System.";
var Name = "Unknown OS";
if (navigator.userAgent.indexOf("Win") != -1) Name =
"Windows OS";
if (navigator.userAgent.indexOf("Mac") != -1) Name =
"Macintosh";
if (navigator.userAgent.indexOf("Linux") != -1) Name =
"Linux OS";
if (navigator.userAgent.indexOf("Android") != -1) Name =
"Android OS";
if (navigator.userAgent.indexOf("like Mac") != -1) Name =
"iOS";
function GFG_Fun() {
el_down.innerHTML = Name;
}
</script>
</body>
</html>
|
Output:
-
Before clicking on the button:
-
After clicking on the button: