The navigator Object

Contact Us or call 1-877-932-8228
The navigator Object

The navigator Object

In the days of Netscape 4, it was common practice to branch code based on your user's browser. This is almost always a bad idea. It's better practice to check for and respond to feature support than to base your code on the type or version of the user's browser. That said, in some cases, it can be useful to be able to know what browser type and version your visitor is using. Consider, for example, a support form. Many support forms ask users what browser and operating system they're using as this can be useful information for debugging the problem. But users sometimes do not provide accurate information. And sometimes the support tech needs additional information like whether cookies are enabled. The window.navigator object to the rescue!

The following demo shows some of the navigator properties and their values. Open it in your browser to see what it reports.

The properties specified in the HTML5 specification are highlighted in yellow.

Code Sample:

NavigatorHistoryLocation/Demos/navigator.html
---- C O D E   O M I T T E D ----
<ol>
	<li>appCodeName: <strong><script type="text/javascript">document.write(navigator.appCodeName);</script></strong></li>
	<li>appMinorVersion: <strong><script type="text/javascript">document.write(navigator.appMinorVersion);</script></strong></li>
	<li class="html5">appName: <strong><script type="text/javascript">document.write(navigator.appName);</script></strong></li>
	<li class="html5">appVersion: <strong><script type="text/javascript">document.write(navigator.appVersion);</script></strong></li>
	<li>browserLanguage: <strong><script type="text/javascript">document.write(navigator.browserLanguage);</script></strong></li>
	<li>buildID: <strong><script type="text/javascript">document.write(navigator.buildID);</script></strong></li>
	<li>cookieEnabled: <strong><script type="text/javascript">document.write(navigator.cookieEnabled);</script></strong></li>
	<li>cpuClass: <strong><script type="text/javascript">document.write(navigator.cpuClass);</script></strong></li>
	<li>language: <strong><script type="text/javascript">document.write(navigator.language);</script></strong></li>
	<li>mimeTypes: <strong><script type="text/javascript">document.write(navigator.mimeTypes);</script></strong></li>
	<li>onLine: <strong><script type="text/javascript">document.write(navigator.onLine);</script></strong></li>
	<li>oscpu: <strong><script type="text/javascript">document.write(navigator.oscpu);</script></strong></li>
	<li class="html5">platform: <strong><script type="text/javascript">document.write(navigator.platform);</script></strong></li>
	<li>plugins: <strong><script type="text/javascript">document.write(navigator.plugins);</script></strong></li>
	<li>product: <strong><script type="text/javascript">document.write(navigator.product);</script></strong></li>
	<li>productSub: <strong><script type="text/javascript">document.write(navigator.productSub);</script></strong></li>
	<li>securityPolicy: <strong><script type="text/javascript">document.write(navigator.securityPolicy);</script></strong></li>
	<li>systemLanguage: <strong><script type="text/javascript">document.write(navigator.systemLanguage);</script></strong></li>
	<li class="html5">userAgent: <strong><script type="text/javascript">document.write(navigator.userAgent);</script></strong></li>
	<li>userLanguage: <strong><script type="text/javascript">document.write(navigator.userLanguage);</script></strong></li>
	<li>userProfile: <strong><script type="text/javascript">document.write(navigator.userProfile);</script></strong></li>
	<li>vendor: <strong><script type="text/javascript">document.write(navigator.vendor);</script></strong></li>
	<li>vendorSub: <strong><script type="text/javascript">document.write(navigator.vendorSub);</script></strong></li>
</ol>
</body>
</html>

Below we show the results in Google Chrome 9 (beta) and Internet Explorer 9 (beta):

Checking for Disabled Features

You may have noticed the cookieEnabled property in the screenshots above. In some cases, a browser may support a feature, but the user might have disabled it. This is most common with cookies, which users sometimes disable for (perceived) security reasons. The following demo shows how to check whether cookies are disabled:

Code Sample:

NavigatorHistoryLocation/Demos/cookie-check.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Cookie Check</title>
</head>
<body>
<script>
if (!navigator.cookieEnabled) {
	document.write("<h1>Warning: Cookies Required</h1>");
	document.write("<p>Please turn your cookies on and refresh the page.</p>");
	document.bgColor="red";
}
</script>
<p>Rest of page goes here...</p>
</body>
</html>

Note that Google Chrome has a bug that causes it to report false positives for navigator.cookieEnabled.

Next