Détecter la version IE (antérieure à la v9) en JavaScript

246

Je souhaite renvoyer les utilisateurs de notre site Web vers une page d'erreur s'ils utilisent une version Internet Explorerantérieure à la v9. Cela ne vaut tout simplement pas notre temps et notre argent pour soutenirIE pre-v9 . Les utilisateurs de tous les autres navigateurs non IE vont bien et ne devraient pas être renvoyés. Voici le code proposé:

if(navigator.appName.indexOf("Internet Explorer")!=-1){     //yeah, he's using IE
    var badBrowser=(
        navigator.appVersion.indexOf("MSIE 9")==-1 &&   //v9 is ok
        navigator.appVersion.indexOf("MSIE 1")==-1  //v10, 11, 12, etc. is fine too
    );

    if(badBrowser){
        // navigate to error page
    }
}

Ce code fera-t-il l'affaire?

Pour éviter quelques commentaires qui viendront probablement à ma rencontre:

  1. Oui, je sais que les utilisateurs peuvent forger leur useragent chaîne. Je ne suis pas inquiet.
  2. Oui, je sais que les pros de la programmation préfèrent renifler la prise en charge des fonctionnalités plutôt que le type de navigateur, mais je ne pense pas que cette approche soit logique dans ce cas. Je sais déjà que tous les navigateurs (pertinents) non IE prennent en charge les fonctionnalités dont j'ai besoin et que touspre-v9 IE navigateurs ne le font pas. La vérification fonctionnalité par fonctionnalité sur l'ensemble du site serait un gaspillage.
  3. Oui, je sais que quelqu'un essaie d'accéder au site en utilisant IE v1 (ou> = 20) ne mettrait pas «badBrowser» sur true et la page d'avertissement ne s'afficherait pas correctement. C'est un risque que nous sommes prêts à prendre.
  4. Oui, je sais que Microsoft a des "commentaires conditionnels" qui peuvent être utilisés pour une détection précise de la version du navigateur. IE ne prend plus en charge les commentaires conditionnels depuis IE 10, ce qui rend cette approche absolument inutile.

Y a-t-il d'autres problèmes évidents à connaître?

javascript  internet-explorer  user-agent  browser-detection 
— Chad Decker
source
122
«Cela ne vaut tout simplement pas notre temps et notre argent pour prendre en charge IE pré-v9» J'aimerais pouvoir faire cela.
— Hassan
2
Basé sur le point [2], je ne suggérerai pas Modernizr ( en.wikipedia.org/wiki/Modernizr ) - tout le monde doit tracer une ligne dans le sable quelque part - mais IE9 semble être une ligne haute
— amelvin
1
Les commentaires conditionnels ne sont que des commentaires normaux. Seul IE les interprète comme des codes spéciaux. IE10 + ne fera plus cela.
— Andreas
3
Les commentaires conditionnels seront traités exactement de la même manière par IE 10 que les navigateurs non IE. Ce sont des commentaires HTML valides et seront donc traités comme tels. Je suis d'accord avec Andreas et je pense que les commentaires conditionnels sont la voie à suivre.
— Tim Down
1
La documentation officielle qui dit qu'IE10 + ne prend pas en charge les commentaires conditionnels: blogs.msdn.com/b/ie/archive/2011/07/06/… - Merci à: stackoverflow.com/a/9900331/320399
— blong

Réponses:

354

C'est ma façon préférée de le faire. Il donne un contrôle maximal. (Remarque: les instructions conditionnelles ne sont prises en charge que dans IE5 - 9.)

Configurez d'abord vos classes ie correctement

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>    <html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>    <html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->    
<head>

Ensuite, vous pouvez simplement utiliser CSS pour faire des exceptions de style, ou, si vous le souhaitez, vous pouvez ajouter du JavaScript simple:

(function ($) {
    "use strict";

    // Detecting IE
    var oldIE;
    if ($('html').is('.lt-ie7, .lt-ie8, .lt-ie9')) {
        oldIE = true;
    }

    if (oldIE) {
        // Here's your JS for IE..
    } else {
        // ..And here's the full-fat code for everyone else
    }

}(jQuery));

Merci à Paul Irish .

— Jezen Thomas
source
21
Étant donné que l'OP a demandé une solution purement JavaScript, je pense que la réponse de @Tim Down ci-dessous est meilleure, car elle n'implique pas de modifier le code HTML existant, et n'utilise pas jQuery: stackoverflow.com/a/10965203/134120
— AsGoodAsItGets
Je reçois une erreur avec ceci sur le validateur html w3:Error: Saw <!-- within a comment. Probable cause: Nested comment (not allowed). At line 5, column 21 if gt IE 8]><!--><html
— abumalick
161

Retourne la version IE ou sinon IE retourne faux

function isIE () {
  var myNav = navigator.userAgent.toLowerCase();
  return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
}

Exemple:

if (isIE () == 8) {
 // IE8 code
} else {
 // Other versions IE or not IE
}

ou

if (isIE () && isIE () < 9) {
 // is IE version less than 9
} else {
 // is IE 9 and later or not IE
}

ou 

if (isIE()) {
 // is IE
} else {
 // Other browser
}
— weroro
source
36
Ne fonctionne pas pour IE11. Depuis IE 11, ils ont changé la chaîne UA en"mozilla/5.0 (windows nt 6.3; wow64; trident/7.0; .net4.0e; .net4.0c; media center pc 6.0; .net clr 3.5.30729; .net clr 2.0.50727; .net clr 3.0.30729; rv:11.0) like gecko"
— Annie
22
Veuillez noter que dans FF "false <9" est "true". Donc, la condition devrait êtreif (isIE () && isIE () < 9) {
— nZeus
3
@DeadlyChambers peut-être fonctionnait-il en mode standard IE7? msdn.microsoft.com/en-us/library/ie/cc196988(v=vs.85).aspx
— mason81
4
La réponse approuvée est de savoir comment détecter la version IE en HTML. Cela répond à la question d'origine.
— Matt Wagner
2
@PrasadGayan - Microsoft Edge n'est pas Internet Explorer. Donc, retourner faux semble être la bonne chose à faire.
— BryanGrezeszak
120

Si personne d'autre n'a ajouté une addEventListerméthode -et que vous utilisez le bon mode de navigation, vous pouvez vérifier IE 8 ou moins avec

if (window.attachEvent && !window.addEventListener) {
    // "bad" IE
}

Internet Explorer hérité et attachEvent (MDN)

— Andreas
source
7
Cela semble être le moyen le plus efficace de détecter IE <= 8 entièrement en JavaScript - et est idéal pour les gens comme moi qui recherchaient un moyen de le faire.
— Gregory Magarshak
Génial! Cela détecte également IE9 en mode Quirks, ce que je cherchais.
— sstur
7
Bien qu'il s'agisse d'une solution «facile à utiliser», elle comporte certains risques. N'importe qui dans votre entreprise (qui n'est pas au courant de votre solution) peut implémenter "addEventListener" ou "attachEvent" pour faire face à son absence dans IE 8. Et puis, votre code cessera de fonctionner.
— Zé Carlos
@RoyiNamir Ce teste pour IE8. Pourquoi diable devrait-il retourner vrai sur IE11?
— Andreas
@Andreas oups. n'a pas vu que OP veut avant ie9. suppression.
— Royi Namir
114

Utilisez des commentaires conditionnels. Vous essayez de détecter les utilisateurs d'IE <9 et les commentaires conditionnels fonctionneront dans ces navigateurs; dans les autres navigateurs (IE> = 10 et non IE), les commentaires seront traités comme des commentaires HTML normaux, ce qu'ils sont.

Exemple HTML:

<!--[if lt IE 9]>
WE DON'T LIKE YOUR BROWSER
<![endif]-->

Vous pouvez également le faire uniquement avec un script, si vous avez besoin:

var div = document.createElement("div");
div.innerHTML = "<!--[if lt IE 9]><i></i><![endif]-->";
var isIeLessThan9 = (div.getElementsByTagName("i").length == 1);
if (isIeLessThan9) {
    alert("WE DON'T LIKE YOUR BROWSER");
}
— Tim Down
source
5
La version JavaScript de la réponse de @Tim Down a très bien fonctionné pour moi. J'ai utilisé BrowserStack pour le tester avec Windows 7 et IE 8, 9, 10 et 11; Mac OS X Snow Leopard avec Safari 5.1, Firefox 28.0, Chrome 33.0 et Opera 20.0; iPhone 5 Mobile Safari; et Android Samsung Galaxy Tab 2 10.1 4.0. Comme prévu, seul IE8 a signalé qu'il s'agissait de IeLessThan9. Agréable!
— Steve Saporta
58

Pour détecter MSIE (v6 - v7 - v8 - v9 - v10 - v11) facilement: 

if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) {
   // MSIE
}
— EpokK
source
Utile pour détecter IE10, car il ne prend pas en charge les commentaires conditionnels. Ne fonctionne pas dans IE11, mais IE11 a généralement un comportement correct
— personne3000
11
Enfin une réponse qui ne donne pas de cours sur l'utilisation de la détection des fonctionnalités et répond en fait à la question.
— cdmckay
32

Voici comment AngularJS vérifie IE

/**
 * documentMode is an IE-only property
 * http://msdn.microsoft.com/en-us/library/ie/cc196988(v=vs.85).aspx
 */
var msie = document.documentMode;

if (msie < 9) {
    // code for IE < 9
}
— iurii
source
Wow, c'est tellement plus simple que tous les commentaires conditionnels! Aucune limitation de cela?
— andrewb
selon les documents, IE8 + prend en charge cette propriété, donc je pense que cela devrait être suffisant pour la plupart des cas.
— iurii
Selon la référence MSDN, «Lorsque le document actuel n'a pas encore été déterminé, documentMode renvoie une valeur de zéro (0). Cela se produit généralement lors du chargement d'un document.» Est-ce à dire que vous pourriez ne pas obtenir une réponse valide dans un script chargé dans <head>?
— Erik Knowles
Je pense que vous pouvez le corriger en vérifiant la valeur sur window.onload lorsque le document est déjà chargé.
— iurii
19

Détection de la version IE à l'aide de la détection des fonctionnalités (IE6 +, les navigateurs antérieurs à IE6 sont détectés comme 6, renvoie null pour les navigateurs non IE):

var ie = (function (){
    if (window.ActiveXObject === undefined) return null; //Not IE
    if (!window.XMLHttpRequest) return 6;
    if (!document.querySelector) return 7;
    if (!document.addEventListener) return 8;
    if (!window.atob) return 9;
    if (!document.__proto__) return 10;
    return 11;
})();

Edit: J'ai créé un repo bower / npm pour votre commodité: ie-version

Mettre à jour:

une version plus compacte peut être écrite sur une seule ligne:

return window.ActiveXObject === undefined ? null : !window.XMLHttpRequest ? 6 : !document.querySelector ? 7 : !document.addEventListener ? 8 : !window.atob ? 9 : !document.__proto__ ? 10 : 11;
— Gabriel Llamas
source
16

Cette fonction renverra le numéro de version principale d'IE sous forme d'entier, ou undefinedsi le navigateur n'est pas Internet Explorer. Ceci, comme toutes les solutions d'agent utilisateur, est sensible à l'usurpation d'agent utilisateur (qui est une fonction officielle d'IE depuis la version 8).

function getIEVersion() {
    var match = navigator.userAgent.match(/(?:MSIE |Trident\/.*; rv:)(\d+)/);
    return match ? parseInt(match[1]) : undefined;
}
— Owen
source
Owen, comment utilise-t-on cela dans la pratique? Comment récupérer la valeur de retour? J'ai essayé console.log(!!match && parseInt(match[1])), console.log(parseInt(match[1]))et console.log(match), mais aucun résultat avec aucun d'entre eux.
— Frank Conijn
Obtenez la valeur de retour en appelant la fonction elle-même getIEVersion(). Par exemple:if (getIEVersion() < 9) {/* IE 8 or below */} if (!getIEVersion()) {/* Not IE */}
— Owen
15

Détecter IE dans JS à l'aide de commentaires conditionnels

// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
//     ie === undefined
// If you're in IE (>=5) then you can determine which version:
//     ie === 7; // IE7
// Thus, to detect IE:
//     if (ie) {}
// And to detect the version:
//     ie === 6 // IE6
//     ie > 7 // IE8, IE9 ...
//     ie < 9 // Anything less than IE9
// ----------------------------------------------------------

// UPDATE: Now using Live NodeList idea from @jdalton

var ie = (function(){

    var undef,
        v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');

    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    );

    return v > 4 ? v : undef;

}());
— jKey
source
C'est à peu près la même chose que ma réponse.
— Tim Down
@TimDown: Peut-être, mais cette réponse est un peu plus complète (elle vous indique le numéro de version) et est bien commentée. De plus, le lien au début de cette réponse mène à un Gist avec plusieurs commentaires informatifs et des variations intéressantes sur cette technique.
— Alan
@Alan: Fair points. J'ai adapté le mien à la question, mais je n'ai pas cité la source.
— Tim Down
12

Cela fonctionne pour moi. Je l'utilise comme redirection vers une page qui explique pourquoi nous n'aimons pas <IE9 et fournissons des liens vers les navigateurs que nous préférons.

<!--[if lt IE 9]>
<meta http-equiv="refresh" content="0;URL=http://google.com">
<![endif]-->
— iconMatrix
source
1
Ohw, c'est méchant. J'utilise une méthode plus conviviale, affiche un div avec l'apparence d'un avertissement IE et lorsque le visiteur clique dessus, l'utilisateur se rend sur Browsehappy.com
— Codebeat
10

Votre code peut faire la vérification, mais comme vous le pensiez, si quelqu'un essaie d'accéder à votre page en utilisant IE v1 ou> v19 n'obtiendra pas l'erreur, il pourrait donc être plus sûr de faire la vérification avec l'expression Regex comme ce code ci-dessous:

var userAgent = navigator.userAgent.toLowerCase();
// Test if the browser is IE and check the version number is lower than 9
if (/msie/.test(userAgent) && 
    parseFloat((userAgent.match(/.*(?:rv|ie)[\/: ](.+?)([ \);]|$)/) || [])[1]) < 9) {
  // Navigate to error page
}
— Fong-Wan Chau
source
Ce n'est pas une bonne réponse. Le reniflage UA n'est pas fiable. Plus d'informations à ce sujet ici: modernizr.com/docs
— Jezen Thomas
3
@Jezen Parfois, UA-sniffing est la voie à suivre: github.com/Modernizr/Modernizr/issues/538
— István Ujj-Mészáros
8

Les commentaires conditionnels ne sont plus pris en charge dans IE à partir de la version 10, comme indiqué sur la page de référence Microsoft .

var ieDetector = function() {
  var browser = { // browser object

      verIE: null,
      docModeIE: null,
      verIEtrue: null,
      verIE_ua: null

    },
    tmp;

  tmp = document.documentMode;
  try {
    document.documentMode = "";
  } catch (e) {};

  browser.isIE = typeof document.documentMode == "number" || eval("/*@cc_on!@*/!1");
  try {
    document.documentMode = tmp;
  } catch (e) {};

  // We only let IE run this code.
  if (browser.isIE) {
    browser.verIE_ua =
      (/^(?:.*?[^a-zA-Z])??(?:MSIE|rv\s*\:)\s*(\d+\.?\d*)/i).test(navigator.userAgent || "") ?
      parseFloat(RegExp.$1, 10) : null;

    var e, verTrueFloat, x,
      obj = document.createElement("div"),

      CLASSID = [
        "{45EA75A0-A269-11D1-B5BF-0000F8051515}", // Internet Explorer Help
        "{3AF36230-A269-11D1-B5BF-0000F8051515}", // Offline Browsing Pack
        "{89820200-ECBD-11CF-8B85-00AA005B4383}"
      ];

    try {
      obj.style.behavior = "url(#default#clientcaps)"
    } catch (e) {};

    for (x = 0; x < CLASSID.length; x++) {
      try {
        browser.verIEtrue = obj.getComponentVersion(CLASSID[x], "componentid").replace(/,/g, ".");
      } catch (e) {};

      if (browser.verIEtrue) break;

    };
    verTrueFloat = parseFloat(browser.verIEtrue || "0", 10);
    browser.docModeIE = document.documentMode ||
      ((/back/i).test(document.compatMode || "") ? 5 : verTrueFloat) ||
      browser.verIE_ua;
    browser.verIE = verTrueFloat || browser.docModeIE;
  };

  return {
    isIE: browser.isIE,
    Version: browser.verIE
  };

}();

document.write('isIE: ' + ieDetector.isIE + "<br />");
document.write('IE Version Number: ' + ieDetector.Version);
Développer l'extrait

puis utilisez:

if((ieDetector.isIE) && (ieDetector.Version <= 9))
{

}
— Arnold.Krumins
source
1
Ce fut la seule chose qui a fonctionné sur l'ensemble du net, au moins l'humongus des choses que j'ai essayé ... thx;)
— Henrique C.
Ce code est bon, mais ne peut pas détecter le mode d'affichage de compatibilité. Je suis sur IE 11 en utilisant la vue de compatibilité dans IE 8 et ce code donne toujours version 11EDIT: Ce code est incroyable! haha, ça donne un objet avec tout à l'intérieur. La version est 11 mais docModeIR est égal à 9. Merci!
— MarceloBarbosa
5

Pour ie 10 et 11:

Vous pouvez utiliser js et ajouter une classe en html pour maintenir la norme des commentaires conditionnels :

  var ua = navigator.userAgent,
      doc = document.documentElement;

  if ((ua.match(/MSIE 10.0/i))) {
    doc.className = doc.className + " ie10";

  } else if((ua.match(/rv:11.0/i))){
    doc.className = doc.className + " ie11";
  }

Ou utilisez une lib comme bowser:

https://github.com/ded/bowser

Ou modernizr pour la détection des fonctionnalités:

http://modernizr.com/

— Liko
source
2
J'ai essayé quelques scripts et solutions mais rien n'a fonctionné. Ensuite, j'ai inclus bowser dans le projet et cela a fonctionné. Donc, un pour avoir suggéré Bowser.
— Moulde
3

Pour détecter Internet Explorer 10 | 11, vous pouvez utiliser ce petit script immédiatement après la balise body:

Dans mon cas, j'utilise la bibliothèque jQuery chargée dans la tête. 

<!DOCTYPE HTML>
<html>
<head>
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
    <script>if (navigator.appVersion.indexOf('Trident/') != -1) $("body").addClass("ie10");</script>
</body>
</html>
— Brian
source
J'aime ça merci, j'ai seulement besoin de détecter 10 ou 11 car je ne supporte pas les versions précédentes
— Nearpoint
IE9 est également trident mais pas le même avec le support CSS. Votre détection pense que c'est au moins 10 mais ce n'est pas correct.
— Codebeat
2 
var Browser = new function () {
    var self = this;
    var nav = navigator.userAgent.toLowerCase();
    if (nav.indexOf('msie') != -1) {
        self.ie = {
            version: toFloat(nav.split('msie')[1])
        };
    };
};


if(Browser.ie && Browser.ie.version > 9)
{
    // do something
}
— Berezh
source
2

Selon Microsoft , ce qui suit est la meilleure solution, elle est également très simple:

function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
    var rv = -1; // Return value assumes failure.
    if (navigator.appName == 'Microsoft Internet Explorer')
    {
        var ua = navigator.userAgent;
        var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
        if (re.exec(ua) != null)
            rv = parseFloat( RegExp.$1 );
    }
    return rv;
}

function checkVersion()
{
    var msg = "You're not using Internet Explorer.";
    var ver = getInternetExplorerVersion();

    if ( ver > -1 )
    {
        if ( ver >= 8.0 ) 
            msg = "You're using a recent copy of Internet Explorer."
        else
            msg = "You should upgrade your copy of Internet Explorer.";
      }
    alert( msg );
}
— AHH
source
En effet, et juste au cas où quelqu'un d'autre atterrirait ici en essayant d'utiliser ce qui précède, le code dans une réponse ultérieure fonctionne pour IE11 ( stackoverflow.com/a/26375930/1129926 ). Mais attention, cela fonctionnera-t-il pour IE12, etc.? En fin de compte, il est préférable de les considérer comme des hacks temporaires et ils échoueront probablement plus tard à mesure que de nouvelles versions de navigateur seront publiées (je ne mentionnerai même pas Edge).
— Jeff Mergler
1

Je vais recommander de ne pas réécrire ce code pour la énième fois. Je vous recommande d'utiliser la bibliothèque Conditionizr ( http://conditionizr.com/ ) qui est capable de tester des versions spécifiques d'IE ainsi que d'autres navigateurs, systèmes d'exploitation, et même la présence ou l'absence d'écrans Retina.

N'incluez le code que pour les tests spécifiques dont vous avez besoin et vous bénéficiez également d'une bibliothèque testée qui a subi de nombreuses itérations (et qui serait facile à mettre à niveau sans casser votre code).

Il s'intègre également parfaitement à Modernizr, qui peut gérer tous les cas où vous feriez mieux de tester une fonctionnalité spécifique plutôt qu'un navigateur spécifique.

— John Munsch
source
1

J'aime ça:

<script>
   function isIE () {
       var myNav = navigator.userAgent.toLowerCase();
       return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
   }    
   var ua = window.navigator.userAgent;
   //Internet Explorer | if | 9-11

   if (isIE () == 9) {
       alert("Shut down this junk! | IE 9");
   } else if (isIE () == 10){
       alert("Shut down this junk! | IE 10");
   } else if (ua.indexOf("Trident/7.0") > 0) {
       alert("Shut down this junk! | IE 11");
   }else{
       alert("Thank god it's not IE!");
   }

</script>
— Julio Cesar Boaroli
source
1

Cette approche pour détecter IE combine les forces et évite les faiblesses de la réponse de jKey en utilisant des commentaires conditionnels et de la réponse d'Owen en utilisant des agents utilisateurs.

  • L'approche de jKey fonctionne jusqu'à la version 9 et à l'abri de l'usurpation d'agent utilisateur dans IE 8 et 9.

  • L'approche d'Owen peut échouer sur IE 5 et 6 (rapport 7) et est sensible à l'usurpation d'identité UA, mais il peut détecter des versions IE> = 10 (maintenant également 12, ce qui est postérieur à la réponse d'Owen). 

    // ----------------------------------------------------------
// A short snippet for detecting versions of IE
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
//     ie === undefined
// Thus, to detect IE:
//     if (ie) {}
// And to detect the version:
//     ie === 6 // IE6
//     ie > 7 // IE8, IE9 ...
// ----------------------------------------------------------
var ie = (function(){
    var v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');

    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    );
    if (v <= 4) { // Check for IE>9 using user agent
        var match = navigator.userAgent.match(/(?:MSIE |Trident\/.*; rv:|Edge\/)(\d+)/);
        v = match ? parseInt(match[1]) : undefined;
    }
    return v;
}());

Cela peut être utilisé pour définir des classes utiles pour votre document contenant la version IE:

    if (ie) {
        document.documentElement.className += ' ie' + ie;
        if (ie < 9)
            document.documentElement.className += ' ieLT9';
    }

Notez qu'il détecte le mode de compatibilité utilisé, si IE est en mode de compatibilité. Notez également que la version IE est surtout utile pour les anciennes versions (<10); les versions supérieures sont plus conformes aux normes et il est probablement préférable de vérifier les fonctionnalités à l'aide de quelque chose comme modernizr.js.

— jtbr
source
1

J'ai fait un mixage de soulignement pratique pour cela.

_.isIE();        // Any version of IE?
_.isIE(9);       // IE 9?
_.isIE([7,8,9]); // IE 7, 8 or 9?

_.mixin({
  isIE: function(mixed) {
    if (_.isUndefined(mixed)) {
      mixed = [7, 8, 9, 10, 11];
    } else if (_.isNumber(mixed)) {
      mixed = [mixed];
    }
    for (var j = 0; j < mixed.length; j++) {
      var re;
      switch (mixed[j]) {
        case 11:
          re = /Trident.*rv\:11\./g;
          break;
        case 10:
          re = /MSIE\s10\./g;
          break;
        case 9:
          re = /MSIE\s9\./g;
          break;
        case 8:
          re = /MSIE\s8\./g;
          break;
        case 7:
          re = /MSIE\s7\./g;
          break;
      }

      if (!!window.navigator.userAgent.match(re)) {
        return true;
      }
    }

    return false;
  }
});

console.log(_.isIE());
console.log(_.isIE([7, 8, 9]));
console.log(_.isIE(11));
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
Développer l'extrait

— danrichards
source
1

ou simplement

//   IE 10: ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)'; 
//   IE 11: ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko'; 
// Edge 12: ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0'; 
// Edge 13: ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586'; 

var isIE = navigator.userAgent.match(/MSIE|Trident|Edge/)
var IEVersion = ((navigator.userAgent.match(/(?:MSIE |Trident.*rv:|Edge\/)(\d+(\.\d+)?)/)) || []) [1]
— Giacomo
source
0

Le script JS le plus complet que j'ai trouvé pour vérifier les versions d'IE est http://www.pinlady.net/PluginDetect/IE/ . La bibliothèque entière est à http://www.pinlady.net/PluginDetect/Browsers/ .

Avec IE10, les instructions conditionnelles ne sont plus prises en charge.

Avec IE11, l'agent utilisateur ne contient plus MSIE. En outre, l'utilisation de l'agent utilisateur n'est pas fiable car elle peut être modifiée.

En utilisant le script PluginDetect JS, vous pouvez détecter pour IE et détecter les versions exactes en utilisant du code très spécifique et bien conçu qui cible des versions spécifiques d'IE. Ceci est très utile lorsque vous vous souciez exactement de la version du navigateur avec laquelle vous travaillez.

— PressingOnAlways
source
0

Je me rends compte que je suis un peu en retard à la fête ici, mais j'avais vérifié un moyen simple d'une ligne pour indiquer si un navigateur est IE et quelle version à partir de 10 c'était. Je n'ai pas codé cela pour la version 11, donc peut-être qu'un petit amendement sera nécessaire pour cela.

Cependant, c'est le code, il fonctionne comme un objet qui a une propriété et une méthode et repose sur la détection d'objet plutôt que de gratter l'objet navigateur (qui est massivement défectueux car il peut être usurpé).

var isIE = { browser:/*@cc_on!@*/false, detectedVersion: function () { return (typeof window.atob !== "undefined") ? 10 : (typeof document.addEventListener !== "undefined") ? 9 : (typeof document.querySelector !== "undefined") ? 8 : (typeof window.XMLHttpRequest !== "undefined") ? 7 : (typeof document.compatMode !== "undefined") ? 6 : 5; } };

L'utilisation est isIE.browserune propriété qui renvoie un booléen et s'appuie sur des commentaires conditionnels, la méthode isIE.detectedVersion()qui renvoie un nombre compris entre 5 et 10. Je fais l'hypothèse que tout ce qui est inférieur à 6 et que vous êtes en territoire old school sérieux et que vous aurez quelque chose de plus costaud que un paquebot et tout ce qui est supérieur à 10 et vous êtes sur un nouveau territoire. J'ai lu quelque chose sur IE11 qui ne prend pas en charge les commentaires conditionnels mais je n'ai pas complètement enquêté, c'est peut-être pour une date ultérieure.

Quoi qu'il en soit, tel qu'il est, et pour une seule ligne, il couvrira les bases du navigateur IE et de la détection de version. C'est loin d'être parfait, mais il est petit et facilement modifiable.

Juste pour référence, et si quelqu'un a un doute sur la façon de l'implémenter, les conditions suivantes devraient aider. 

var isIE = { browser:/*@cc_on!@*/false, detectedVersion: function () { return (typeof window.atob !== "undefined") ? 10 : (typeof document.addEventListener !== "undefined") ? 9 : (typeof document.querySelector !== "undefined") ? 8 : (typeof window.XMLHttpRequest !== "undefined") ? 7 : (typeof document.compatMode !== "undefined") ? 6 : 5; } };

/* testing IE */

if (isIE.browser) {
  alert("This is an IE browser, with a detected version of : " + isIE.detectedVersion());
}
— Ric
source
0

Détecter IE et ses versions ne pourrait pas être plus facile, et tout ce dont vous avez besoin est un peu de Javascript natif / vanille: 

var uA = navigator.userAgent;
var browser = null;
var ieVersion = null;

if (uA.indexOf('MSIE 6') >= 0) {
    browser = 'IE';
    ieVersion = 6;
}
if (uA.indexOf('MSIE 7') >= 0) {
    browser = 'IE';
    ieVersion = 7;
}
if (document.documentMode) { // as of IE8
    browser = 'IE';
    ieVersion = document.documentMode;
}

Et c'est une façon de l'utiliser: 

if (browser == 'IE' && ieVersion <= 9) 
    document.documentElement.className += ' ie9-';

.

Fonctionne dans toutes les versions d'IE, y compris les versions supérieures en mode / mode de compatibilité inférieur, et documentModeest propriétaire d'IE.

— Frank Conijn
source
0

Si vous devez supprimer la version du navigateur IE, vous pouvez suivre le code ci-dessous. Ce code fonctionne bien pour la version IE6 à IE11

<!DOCTYPE html>
<html>
<body>

<p>Click on Try button to check IE Browser version.</p>

<button onclick="getInternetExplorerVersion()">Try it</button>

<p id="demo"></p>

<script>
function getInternetExplorerVersion() {
   var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");
        var rv = -1;

        if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer, return version number
        {               
            if (isNaN(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))))) {
                //For IE 11 >
                if (navigator.appName == 'Netscape') {
                    var ua = navigator.userAgent;
                    var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
                    if (re.exec(ua) != null) {
                        rv = parseFloat(RegExp.$1);
                        alert(rv);
                    }
                }
                else {
                    alert('otherbrowser');
                }
            }
            else {
                //For < IE11
                alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
            }
            return false;
        }}
</script>

</body>
</html>
— Nimesh
source
0

La fenêtre s'exécute IE10 sera mise à jour automatique vers IE11 + et sera normalisée W3C

De nos jours, nous n'avons pas besoin de supporter IE8-

    <!DOCTYPE html>
    <!--[if lt IE 9]><html class="ie ie8"><![endif]-->
    <!--[if IE 9]><html class="ie ie9"><![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--><html><!--<![endif]-->
    <head>
        ...
        <!--[if lt IE 8]><meta http-equiv="Refresh" content="0;url=/error-browser.html"><![endif]--
        ...
    </head>
— xicooc
source
0 
var isIE9OrBelow = function()
{
   return /MSIE\s/.test(navigator.userAgent) && parseFloat(navigator.appVersion.split("MSIE")[1]) < 10;
}
— xicooc
source
0 
if (!document.addEventListener) {
    // ie8
} else if (!window.btoa) {
    // ie9
}
// others
— Bruce
source
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.