Browser (and browser version) detection is an “all time classic” development requirement. jQuery.browser WAS an excellent solution, but it was removed in jQuery 1.9.

Actually, it would be better to try to detect a browser feature instead of browser name itself, where possible. An ideal solution for this is Modernizr (a JavaScript library that detects HTML5 and CSS3 features in the user’s browser).

But, if you still need to detect browser and browser version (using javascript), I suggest the following solutions (among many others): Bowser – A Browser detector and Browser detect provided by quirksmode. I prefer the first one.

Bowser – A Browser detector

Get bowser from https://github.com/ded/bowser. Add it to your document with something like this (change /url/to/… with the real url):

<script type="text/javascript" src="/url/to/bowser.min.js"></script>

Code

The HTML part

Let’s create these links for demo:

<p>
Click to <a id="detect_browser"
href="javascript:void(0);">Detect browser properties</a>
</p>

<p>
Click to <a id="detect_version"
href="javascript:void(0);">Detect browser version</a>
</p>

The JAVASCRIPT part

Remark: I use jQuery to handle events, but you can use plain javascript (if you prefer).

<script type="text/javascript">

$(function() {

// detect browser properties
$("#detect_browser").click(function() {
alert(JSON.stringify(bowser, null, ' '));
});

// detect browser version
$("#detect_version").click(function() {
alert(bowser.version);
});

});

</script>

If you need help on JSON.stringify, read this post.

References

Suggested javascript solutions for browser detection

From jQuery docs

Browser Feature detection solutions

By Enrico

My greatest passion is technology. I am interested in multiple fields and I have a lot of experience in software design and development. I started professional development when I was 6 years. Today I am a strong full-stack .NET developer (C#, Xamarin, Azure)

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.