How do I detect IE10 using javascript?

Question

As many already posted in other questions (also in jQuery documentation), the old jQuery.browser.version is deprecated and works only in jquery1.3.

Do you know another simple way to detect it, that I can include in my code before:

function handleInfoDivPopupVisibility(dynamicEleId, staticEleId){
var parentContainer = $('headerSummaryContainer');
var dynamicEle = $(dynamicEleId);
var staticEle = $(staticEleId);

if(isIE() && parentContainer){
    if (jQuery.browser.version != 10) { // I need to find a way to detect if it's IE10 here.
        parentContainer.style.overflow = 'visible'; 
    }
}
dynamicEle ? dynamicEle.style.display = '' : '';
if(dynamicEle && staticEle)
    gui_positionBelow(dynamicEle, staticEle);
}

Before you say it's duplicated question of this or this, I'd like to reinforce that I don't want to use css hacks. Is there a way to detect it just as simple as I could do before?

if (jQuery.browser.version != 10) {...

Answer 1

In general it's a bad idea to check for browser version, it's considered a better practice to check for browser features. But if you're sure what you're doing:

function getIEVersion(){
    var agent = navigator.userAgent;
    var reg = /MSIE\s?(\d+)(?:\.(\d+))?/i;
    var matches = agent.match(reg);
    if (matches != null) {
        return { major: matches[1], minor: matches[2] };
    }
    return { major: "-1", minor: "-1" };
}

var ie_version =  getIEVersion();
var is_ie10 = ie_version.major == 10;

We have the following code in production, so it works and well-tested.

And yes, we did have a need to detect IE10, not just a particular feature that exists in IE10 but not in earlier versions.

Answer 2

Internet Explorer has the feature of Conditional Compilation (http://www.javascriptkit.com/javatutors/conditionalcompile.shtml). You can use this:

var isIE10 = false;
/*@cc_on
    if (/^10/.test(@_jscript_version)) {
        isIE10 = true;
    }
@*/
alert(isIE10);

DEMO: http://jsfiddle.net/X3Rvz/1/

You can put this before all your JavaScript code, and from then on just reference isIE10.

The conditional compilation won't run in non-IE, so isIE10 will still be false. And @_jscript_version will only start with 10 in IE 10.

Conditional Comments aren't supported in IE 10, and the User-Agent string can be spoofed.

Since minification usually removes comments, you can use eval or Function to find out in a similar fashion:

var isIE10 = false;
if (Function('/*@cc_on return /^10/.test(@_jscript_version) @*/')()) {
    isIE10 = true;
}

DEMO: http://jsfiddle.net/wauGa/2/

---

UPDATE:

To still avoid minification of comments but also combine detecting any version, you can use something like:

var IE = (function () {
    "use strict";

    var ret, isTheBrowser,
        actualVersion,
        jscriptMap, jscriptVersion;

    isTheBrowser = false;
    jscriptMap = {
        "5.5": "5.5",
        "5.6": "6",
        "5.7": "7",
        "5.8": "8",
        "9": "9",
        "10": "10"
    };
    jscriptVersion = new Function("/*@cc_on return @_jscript_version; @*/")();

    if (jscriptVersion !== undefined) {
        isTheBrowser = true;
        actualVersion = jscriptMap[jscriptVersion];
    }

    ret = {
        isTheBrowser: isTheBrowser,
        actualVersion: actualVersion
    };

    return ret;
}());

And access the properties like IE.isTheBrowser and IE.actualVersion (which is translated from internal values of JScript versions).

Answer 3

The jQuery.browser.version still works but you have to include the jquery-migrate plugin.

http://api.jquery.com/jQuery.browser/ https://github.com/jquery/jquery-migrate/#readme

Answer 4

Here is a one line solution to detect IE 10

var IE10 = navigator.userAgent.toString().toLowerCase().indexOf("trident/6")>-1;

and for more information on other version and browsers please refer this Link of Browser Detection

Answer 5

The IE10 User-Agent String says

However if your site is still using user-agent sniffing, then increasing the “MSIE” token to “10.0” is particularly noteworthy. Why? Because it adds an extra digit to the string value of the token. Most sites will handle this effortlessly, but some will process the extra digit incorrectly, causing them to identify IE10 as IE1.

To help illustrate, here’s a regular expression that only captures the first digit of the “MSIE” token’s value:

// INCORRECT: will report IE10 version in capture 1 as "1"
var matchIE = /MSIE\s(\d)/;

And here’s one that captures the full value of the “MSIE” token:

// Correct: will report IE10 version in capture 1 as "10.0"
var matchIE = /MSIE\s([\d.]+)/

Answer 6

I Found myself having a issue (border radius on frameset with legend) with IE 9 through 11 (did not check IE 12)
MSIE is no long user agent in IE 11 and the appName is Mozilla, however trident is in there I managed to extract the trident version # and detect it

if(navigator.appVersion.indexOf('Trident/')>-1){// Begin stupid IE crap
    var IE=navigator.appVersion;
    IE=IE.slice(IE.indexOf('Trident/')+8);
    IE=IE.slice(0,IE.indexOf(';'));
    IE=Number(IE);
    if(IE>=5&&IE<=7) // IE 9 through IE 11
        document.body.className='ie';
}