Detect Browser in JavaScript

learning javascript

To detect browser in JavaScript, window.navigator object contains information about the user’s browser i.e. Firefox, Internet Explorer, Opera, etc.

JavaScript has a standard object called navigator which contains data about user’s browser. It has a lot of properties.

JavaScript window.navigator object can be written without window prefix.

For example,

  • navigator.appName
  • navigator.appCodeName
  • navigator.platform

Browser detection is a part of any good JavaScripter’s life.

Using the property navigator.cookieEnabled, you can check whether cookies are enabled or not.

<script>
 console.log("Cookies Enabled? " + navigator.cookieEnabled);
</script>

Using the properties appName and appCodeName you can get the browser name.

<script>
 console.log("Name: " + navigator.appName);
 console.log("Code: " + navigator.appCodeName);
</script>

Read Also: JavaScript Objects Overview

Use appVersion or userAgent, to get browser’s version information.

<script>
 console.log("Version: " + navigator.appVersion);
 console.log("Version: " + navigator.userAgent);
</script>

Use navigator.platform, to get platform of the browser.

<script>
 console.log("Platform: " + navigator.platform);
</script>

You can also check whether Java is enabled in your browser or not.

<script>
 console.log("javaEnabled: " + navigator.javaEnabled());
</script>

See the below example,

// Opera 8.0+
 var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
 var isFirefox = typeof InstallTrigger !== 'undefined';
// At least Safari 3+: "[object HTMLElementConstructor]"
 var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
// Internet Explorer 6-11
 var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
 var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
 var isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
 var isBlink = (isChrome || isOpera) && !!window.CSS;

DEMO: https://jsfiddle.net/4zkyz6d2/

Based on United States, Jacob Frazier is a skilled JavaScript developer with over 8 years of experience. He is passionate about change and trying new things, both professionally and personally. He loves startups and is extremely proactive.

2 thoughts on “Detect Browser in JavaScript”

  1. The code for detecting Safari does not seem to work on macOS or iOS. Also, with the supplied code, the Opera Neon browser returns Chrome. Any Ideas to fix this?

  2. This is not working in Safari 10+
    // At least Safari 3+: “[object HTMLElementConstructor]”
    if (Object.prototype.toString.call(window.HTMLElement).indexOf(‘Constructor’) > 0)
    browserName = “Safari”;

Leave a Reply

Your email address will not be published. Required fields are marked *