Browser Detection in JavaScript

The greatest challenge in web programming, in my opinion, is to make your website compatible to all browsers. [I say - A new browser or even a new version of an old browser is a new pain to programmer.]. Whatever, browser detection is a very important task for web programmer. Following is the JavaScript code to detect browser and OS.

var BrowserDetect = {

init: function ()

{

this.browser = this.searchString(this.dataBrowser) || "An unknown browser";

this.version = this.searchVersion(navigator.userAgent)

|| this.searchVersion(navigator.appVersion)

|| "an unknown version";

this.OS = this.searchString(this.dataOS) || "an unknown OS";

},

searchString: function (data)

{

for (var i=0;i {

var dataString = data[i].string;

var dataProp = data[i].prop;

this.versionSearchString = data[i].versionSearch || data[i].identity;

if (dataString) {

if (dataString.indexOf(data[i].subString) != -1)

return data[i].identity;

}

else if (dataProp)

return data[i].identity;

}

},

searchVersion: function (dataString)

{

var index = dataString.indexOf(this.versionSearchString);

if (index == -1) return;

return parseFloat(dataString.substring(index+this.versionSearchString.length+1));

},

dataBrowser: [

{ string: navigator.userAgent,

subString: "OmniWeb",

versionSearch: "OmniWeb/",

identity: "OmniWeb"

},

{

string: navigator.vendor,

subString: "Apple",

identity: "Safari"

},

{

prop: window.opera,

identity: "Opera"

},

{

string: navigator.vendor,

subString: "iCab",

identity: "iCab"

},

{

string: navigator.vendor,

subString: "KDE",

identity: "Konqueror"

},

{

string: navigator.userAgent,

subString: "Firefox",

identity: "Firefox"

},

{

string: navigator.vendor,

subString: "Camino",

identity: "Camino"

},

{ // for newer Netscapes (6+)

string: navigator.userAgent,

subString: "Netscape",

identity: "Netscape"

},

{

string: navigator.userAgent,

subString: "MSIE",

identity: "Explorer",

versionSearch: "MSIE"

},

{

string: navigator.userAgent,

subString: "Gecko",

identity: "Mozilla",

versionSearch: "rv"

},

{ // for older Netscapes (4-)

string: navigator.userAgent,

subString: "Mozilla",

identity: "Netscape",

versionSearch: "Mozilla"

}

],

dataOS : [

{

string: navigator.platform,

subString: "Win",

identity: "Windows"

},

{

string: navigator.platform,

subString: "Mac",

identity: "Mac"

},

{

string: navigator.platform,

subString: "Linux",

identity: "Linux"

}

]

};

BrowserDetect.init();

Now BrowserDetect.browser, BrowserDetect.version & BrowserDetect.OS will contain the browser name, browser version and OS name respectively.