JAVASCRIPT UTOPIA ![]() |
BROWSER DETECTION BASICS ![]() |
the button below invokes a javascript which examines your browser's name, version, and platform.
the script called by the button retrieves the browser information from the javascript navigator
object. here's how:
getting the browser name
the browser's name is stored as a property of navigator
called appName
. we can request that name as navigator.appName
, or assign it to a variable easily with:
var yourBrowserName = navigator.appName;
getting the browser version
the browser's version is also stored as a property of navigator
called appVersion
. however, appVersion
is not as convenient to use as appName
. appVersion
stores more than just the version number; it also stores information about the platform, the language, the distribution, etc. therefore, to extract the version number from appVersion
, we must use one of two built-in javascript functions: parseInt
and parseFloat
. the former returns the version number as an integer (eg. 3), and the latter returns the full version number, including the floating point (eg. 3.01). we most commonly need to assign version numbers to variables like this:
var browserVersionMajor = parseInt(navigator.appVersion);
var browserVersionFull = parseFloat(navigator.appVersion);
special note for IE5
ie5 reports its appVersion
as 4.0-compatible, not "5" so if you're looking for ie5 specifically, you can't find it using the above means. you have to do an explicit check for an occurence of the text "MSIE 5.0" in the appVersion
string. not sure what drugs microsoft is smoking...
getting the browser platform
in javascript 1.1 and older, the name of the browser's platform is, unfortunately, stored in appVersion
, jumbled with the version information. hence, before javascript 1.2, the platform is not immediately accessible because appVersion
has a changing length and grammatical construction. in order to pull the platform name out of appversion
, we have to compare the value of appVersion
against a list of manually specified platform names. for instance, to check if the browser is running on windows 3.1 or macintosh, we compare appVersion
to "3.1" and "Mac"--knowing that those strings would be part of the appVersion
string on the respective platforms. once we decide which platforms we want to detect, we check for the appropriate strings using javascript's indexOf
method. the indexOf
method searches navigator.appVersion
for the first occurence of our platform name. if indexOf
finds a match, it returns the character index of the match (a positive integer). if no match is found, indexOf
returns -1
. in practise, then, determining the browser's platform before javascript 1.2 is not just a matter of asking the browser "what platform are you running on?". it's more like asking, "are you running on Windows 3.1? are you running on macintosh? are you running on windows nt?" and listening for a "yes" answer. in code, we ask those questions like this:
navigator.appVersion.indexOf("WinNT");
in javascript 1.2 and later (4.0+ browsers) we may use the much more convenient navigator.platform
property, exactly like we used navigator.appName
.
how about a demo?
here's some simple code that demonstrates the topics discussed in this article.
here's another example that shows a quick way to assign a detection variable when you need to handle a specific browser:
var netscape3up = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion)>= 3 )) if(netscape3up) { alert("you're using netscape 3 or higher."); }the variable
netscape_3up
is assigned the value of true
if the conditions after the "=" both evaluate to true
(ie. if the appName
is "Netscape" and the appVersion
is equal to or greater than 3). but if one or both of the conditions evaluate to false
, the variable netscape_3up
is assigned the value false
. for the remainder of our script we can perform netscape 3 specific tasks by simply evaluating the netscape_3up
variable, as in if (netscape_3up)
.
netscape_3up
bit