What You Need To Know JavaScript Window Navigator

Posted by TotalDC

What is JavaScript Window Navigator? The navigator property is a read-only property that contains information about the user’s browser.

You can access it by either full address or for example window.navigator.language or by short version navigator.language since as you may already know – Window is a global object.

How To Detect Whether The Browser Is Online Or Offline In JavaScript

You need to use the navigator.onLine property to detect if the browser is online or offline. This property returns true or false. Here’s how it looks:

<script>
function checkConnectionStatus() {
    if(navigator.onLine) {
        console.log("Application is online.");
    } else {
        console.log("Application is offline.");
    }
}
</script>
 
<button type="button" onclick="checkConnectionStatus();">Check Connection Status</button>

Browser fires online and offline events when a connection is establish or lost. You can attach handler functions to these events to customize your application for online and offline scenarios. Here’s how it works:

<script>
function goOnline() {
    // Action to be performed when your application goes online
    console.log("And we're back!");
}

function goOffline() {
    // Action to be performed when your application goes offline
    console.log("Hey, it looks like you're offline.");
}

// Attaching event handler for the online event
window.addEventListener("online", goOnline);

// Attaching event handler for the offline event
window.addEventListener("offline", goOffline);
</script>

<p>Toggle your internet connection on/off to see how it works.</p>

As you may guess the goOffline() function in the example will be called automatically by the browser when the connection goes offline and the goOnline() function will be called automatically by the browser when the connection goes online.

How To Check If Cookies Are Enabled Or Disabled In JavaScript

For this task, you need to use the navigator.cookieEnabled. This property returns true or false as a result. Let’s look at the example:

<script>
function checkCookieEnabled() {
    if(navigator.cookieEnabled) {
        console.log("Cookies are enabled in your browser.");
    } else {
        console.log("Cookies are disabled in your browser.");
    }
}
</script>
 
<button type="button" onclick="checkCookieEnabled();">Check If Cookies are Enabled</button>

How To Detect The Browser Language In JavaScript

You can use the navigator.language property to detect the language of the browser UI.

This property returns a string representing the language, e.g. “en”, “en-US”, etc. Here’s how it looks:

<script>
function checkLanguage() {
    console.log("Your browser's UI language is: " + navigator.language);
}
</script>
 
<button type="button" onclick="checkLanguage();">Check Language</button>

How To Get Browser Name And Version Information In JavaScript

The Navigator object has five main properties that provide name and version information about the user’s browser. The following list provides a brief overview of these properties:

  • appName — Returns the name of the browser.
  • appVersion — Returns the version number and other information about the browser.
  • appCodeName — Returns the code name of the browser.
  • userAgent — Returns the user agent string for the current browser.
  • platform — Returns the platform on which the browser is running.

Here’s an example for you:

<script>
function getBrowserInformation() {
	let info = "\n App Name: " + navigator.appName;
	   info += "\n App Version: " + navigator.appVersion;
	   info += "\n App Code Name: " + navigator.appCodeName;
	   info += "\n User Agent: " + navigator.userAgent;
	   info += "\n Platform: " + navigator.platform;

    console.log("Here're the information related to your browser: " + info);
}
</script>
 
<button type="button" onclick="getBrowserInformation();">Get Browser Information</button>

How To Check If Java Is Enabled Or Not In JavaScript

Simply use javaEnabled() to check whether the current browser is Java-enabled or not. This method simply indicates whether the preference that controls Java is on or off, it does not reveal whether the browser offers Java support or Java is installed on the user’s system or not. Let’s look at the example:

<script>
function checkJavaEnabled() {
    if(navigator.javaEnabled()) {
        console.log("Your browser is Java enabled.");
    } else {
        console.log("Your browser is not Java enabled.");
    }
}
</script>
 
<button type="button" onclick="checkJavaEnabled();">Check If Java is Enabled</button>

If you missed the last article, you can find it here.