🚨 Time is Running Out: Reserve Your Spot in the Lucky Draw & Claim Rewards! START NOW

Code has been added to clipboard!

Main Tips on Using JavaScript Navigator Method Easily

Reading time 3 min
Published Aug 8, 2017
Updated Oct 2, 2019

Browser object model (BOM) lets you gain more control on how websites are displayed in the browser. BOM has several components: history, location, screen, document, and a navigator. The last one is the main focus of this tutorial.

This tutorial explains the BOM navigator JavaScript uses. Learn about it if you want to apply the JavaScript browser detect functionality. You will read all about JavaScript navigator properties and different ways to apply them as well.

Furthermore, you will learn to make JavaScript detect browser information like its name, the engine name, enabled cookies, etc.

JavaScript Detect Browser: Main Tips

  • Information about the user's browser is contained in the window.navigator JavaScript object.
  • The window prefix is not necessary.
  • JavaScript navigator object information does not always turn out true. You should not rely on it when using JavaScript detect browser version.
  • The same name can be used by different browsers.
  • Some browsers give false information on purpose to bypass site tests.

Browser Names

You can use JavaScript detect browser name functionality by deploying properties appName and appCodeName.

Example
document.getElementById("browser").innerHTML ="AppName is " + navigator.appName + ". appCodeName is " + navigator.appCodeName;

Note: If you're using IE11, Chrome, Firefox, or Safari, appName will return Netscape.

DataCamp
Pros
  • Easy to use with a learn-by-doing approach
  • Offers quality content
  • Gamified in-browser coding experience
  • The price matches the quality
  • Suitable for learners ranging from beginner to advanced
Main Features
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable
Udacity
Pros
  • Simplistic design (no unnecessary information)
  • High-quality courses (even the free ones)
  • Variety of features
Main Features
  • Nanodegree programs
  • Suitable for enterprises
  • Paid Certificates of completion
Udemy
Pros
  • Easy to navigate
  • No technical issues
  • Seems to care about its users
Main Features
  • Huge variety of courses
  • 30-day refund policy
  • Free certificates of completion

Possible Properties

JavaScript navigator object information might be obtained using a few different properties. In this chapter, we will introduce you to cookieEnabled, product, appVersion, userAgent, platform, language, and javaEnabled.

You might have noticed their names are pretty self-explanatory. That makes them easier to memorize and use. Let's view them one by one and see the code example provided to get a better understanding.

cookieEnabled

The cookieEnabled property returns true if cookies are enabled - otherwise it displays false:

Example
document.getElementById("test").innerHTML ="Cookies: " + navigator.cookieEnabled;

product

The product property returns the engine name of the browser:

Example
document.getElementById("engine").innerHTML = navigator.product;

appVersion

The appVersion makes JavaScript detect browser version information:

Example
document.getElementById("version").innerHTML = navigator.appVersion;

userAgent

The navigator userAgent property also makes JavaScript detect browser version information:

Example
document.getElementById("agent").innerHTML = navigator.userAgent;

platform

The platform property makes JavaScript detect browser platform (operating system):

Example
document.getElementById("os").innerHTML = navigator.platform;

language

The language property makes JavaScript detect browser language:

Example
document.getElementById("lang").innerHTML = navigator.language;

javaEnabled

The javaEnabled() method returns true if Java is enabled in a website:

Example
document.getElementById("java").innerHTML = navigator.javaEnabled();

JavaScript Detect Browser: Summary

  • window.navigator JavaScript object contains information about the users' browser.
  • You should not rely on the navigator object information when using JavaScript browser detect version, as some browsers share wrong information intentionally.
  • window.navigator object has multiple properties.
  • You can use these properties to get the name of the browser, check for cookies, browser version information and more. For example, using navigator userAgent will detect browser version information.