Detect browser version

JavaScript
1

I know using javascript, one can detect the name or browser a user is running, but how could one detect the version of a browser

so something like this:


var browser;
function getBrowserName() {
    browser = "Unknown";
    if(navigator.userAgent.indexOf("MSIE")!=-1){
        browser = "MSIE";
    }
    else if(navigator.userAgent.indexOf("Firefox")!=-1){
        browser = "Firefox";
    }
    else if(navigator.userAgent.indexOf("Opera")!=-1){
        browser = "Opera";
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1){
        browser = "Chrome";
    }
    else if(navigator.userAgent.indexOf("Safari")!=-1){
        browser = "Safari";
    }
    return browser;   
}

Then attach a specific css stylesheet based on the version of said browser

this is in pseduo-code
something like:

function browserVersion(){
if (browser=“MSIE”)
{
if((browser.appversion())==6)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“IE6.css” />’);
}
else if((browser.appversion())==7)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“IE7.css” />’);
}
else ((browser.appversion())==9)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href="IE9.css />’);
}
}

else if(browser=“Firefox”)
{
if((browser.appversion())==4)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“FF4.css” />’);
}
else if((browser.appversion())==3)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“FF3.css” />’);
}

    else ((browser.appversion())==2)
        { document.write('&lt;link rel="stylesheet" type="text/css" href="FF2.css" /&gt;');
       }

}

else if(browser=“Chrome”)
{
if((browser.appversion())==3)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“chrome3.css” />’);
}
else if((browser.appversion())==2)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“chrome2.css” />’);
}

    else ((browser.appversion())==1)
        { document.write('&lt;link rel="stylesheet" type="text/css" href="chrome1.css" /&gt;');
       }

}

else (browser=“Safari”)
{
if((browser.appversion())==5)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“safari5.css” />’);
}
else ((browser.appversion())==4)
{ document.write(‘<link rel=“stylesheet” type=“text/css” href=“safari4.css” />’);
}
}
}

Is there someone one could do it with proper javascript?

I would appreicate any help.

Thanks in Advance & Regards,
Team 1504

2

That is an incredibly bad idea, as your web-site will be a time-bomb waiting to go off at the next web browser update.

Please raise the topic of handling different web browsers on the CSS forum to receive the best ideas on how to handle that.

3

I agree, in the conventional case browser sniffing is a poor way of building your site. May I ask why you want to do it this way?

Also, the write() method causes some unwanted problems, it’s better to use innerHTML or DOM methods.

4

What happens to all the Opera, Chrome, and Safari browsers that claim to be IE or Firefox when you perform that text and what about all the IE and Firefox browsers that claim to be ‘Eat at Joe’s Finest Food Restaurant’?

If the browser claims to be IE or Firefox then it could be any browser at all since they can all identify themselves as one of those two and IE and FireFox can identify themselves as anything at all as they allow the browser owner to enter anything in the useragent.

5

Thank you all for the help.
This was just a hypothetical question.
I know it would be absolutely ridiculous to use such a script on an actual site, but I was just wondering if it could be done and if so how.

Also withbthe script I assisted in developing to detect a browser and attach a stylesheet. I wasnt just exercising my skills.

Thank you again

6

The only reason I can think of for someone to change the default value of their browser’s useragent is to attempt to fool a web page into rendering the page content into a browser correctly that would normally not be supported. In that case if the page doesn’t render correctly in the user’s browser then the web page author loses nothing because the user’s browser wasn’t being supported by the page author in the first place.

7

I sometimes find that. I’m browsing with Google Chrome and the web page says that I must use Firefox or Internet Explorer to view their page.

I don’t even bother to change my useragent. If they’re going to pull lazy stunts like that, I just go to a different web site instead. There’s plenty of other web pages to go to.

8

I don’t know if it’s a lazy stunt. The page author is probably just targeting specific browsers in the knowledge that IE and Firefox cover at least 80% of users on average. Maybe the author is happy to forgo users who aren’t using the preferred browser? But in any case, since it’s impractical to support every single browser and version, I would think the author sets a default css for non supported browsers which means the page could still render correctly in at least some of those unsupported browsers.

9

The issue is not about supporting non-supported browsers - the problem is about locking everything else out.

You don’t have to actively support every flavour of web browser that’s out there. That’s why standards are called standards.

Start with the standards, apply special fixes if needed for Internet Explorer and any other specific web browsers that you actively support, and let the rest interpret the page as they will.

It’s not rocket science.

10

ok I think we’re talking about two different scenarios. I agree if the author needs everyone to be able to have the web page rendered correctly. I’m talking about the situation where a page author might want to target a specific audience for whatever reason in which case they can set a css for their target browsers and another css for every other browser and so no-one is technically locked out.

11

Such things are called intranets and extranets - depending on whether the site is accessible only from within a specific network or is available from more than one network (such as a company network and their client’s networks as well).

Such targetting has NO place on the internet where people are free to use ANY browser they like and if the browser they choose follows the standards should expect to be able to get any web page to work. Any that do not work are junk and they will of course tell all their friends about that junk so that their friends can tell their friends etc so that no one will waste time on the junk. Placing junk pages on the internet is basically saying “Go away and tell everyone else to stay away too because all I can create is garbage”.

So yes you are talking about two different scenarios - one on the internet and one not.

12

You’re not suggesting that I or anyone else can’t just target IE and Firefox browsers if we wish to, are you? Just like users can choose whatever browsers they want to use I can choose what browsers I want to support because there are too many diffrent browsers and versions to guarantee 100% that pages will render correctly in all of them. I don’t see anything wrong with making sure the web page renders correctly in IE and FF, which will cover the vast majority of users on average, and then using the FF css (if it is different to the IE) as the default css for non IE/FF browsers.

13

Not at all. The complaint comes in when you purposefully take action to prevent anything else from being able to visit.

14

ok, but I’m not stopping anyone from visiting :slight_smile:

15

That’s good. The “you” there was aimed at the general web developer, not you yourself, if you follow what I mean.

16

yup now I do. The meaning of “you” in your post was ambiguous.

17

That’s where the context of what I was replying to comes in, when you were talking about “I or anyone else”.

Isn’t English comprehension grand?

18

yes :slight_smile: but I never suggested anyone should stop people from visiting their website. All I was saying is that I and everyone else have the right to choose which browsers to support and then provide a default css for users with browsers not on the web developer’s support list. I don’t have the resources to guarantee 100% that a web page will render correctly in all browsers and versions.

19

And that’s a good and reasonable approach to take.