JavaScript Browser Detection

Monday, April 30, 2012

While most of the JavaScript code that you use is supported across modern browsers, some of your JavaScript code will not work for some browsers, especially the older versions. We can use the Navigator object to assist us with this problem. The Navigator object contains information about the visitor's browser. By knowing specific information about the user's browser, we can serve user's session using the appropriate code and information. While there is no public standard that applies to the navigator object, all major browsers support it.

Navigator Object Properties

The Navigator object is created by JavaScript at runtime and not by manually initiating it in the JavaScript code.

appCodeNameReturns the code name of the browser
appNameReturns the name of the browser 
appVersionReturns the version information of the browser
cookieEnabledReturns Boolean value whether cookies are enabled in the browser
languageReturns the default language of the browser version.NS and Firefox only
mimeTypes[]An array of all MIME types supported by the client.NS and Firefox only
platformReturns for which platform the browser is compiled
plugins[]Returns for which platform the browser is compiledNS and Firefox only
systemLanguageReturns the default language of the operating system.IE only
userAgentReturns the user-agent header sent by the browser to the server
userLanguageReturns the preferred language setting of the userIE only

Navigator Object Methods

The Navigator object has two methods that are available for you to use.

javaEnabled()Returns Boolean whether or not the browser has Java enabled
taintEnabled()Returns Boolean whether or not the browser has data tainting enabledIE and Opera only


<div id="browserInfo"></div>
<script type="text/javascript">

 var x = "<p>CodeName: " + navigator.appCodeName + "</p>";
 x += "<p>Name: " + navigator.appName + "</p>";
 x += "<p>Version: " + navigator.appVersion + "</p>";
 x += "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
 x += "<p>Platform: " + navigator.platform + "</p>";
 x += "<p>User-agent header: " + navigator.userAgent + "</p>";

    document.getElementById("browserInfo").innerHTML = x;


Your Browser Information

Here is the information collected about your Browser.

Did you find the page informational and useful? Share it using one of your favorite social sites.

Recommended Books & Training Resources

HTML CSS and JavaScript Editor JavaScript and jQuery: The Missing Manual Professional JavaScript for Web Developers