javascript - ユーザーが IE を使用しているかどうかを確認する

Question

特定のクラスのdivをクリックして、以下のような関数を呼び出しています。

ユーザーが Internet Explorer を使用している場合は機能を開始するときに確認し、他のブラウザーを使用している場合は中止/キャンセルして、IE ユーザーに対してのみ実行する方法はありますか? ここにいるユーザーはすべて IE8 以降のバージョンを使用しているため、IE7 以前のバージョンについて説明する必要はありません。

彼らが使用しているブラウザーがわかれば、それは素晴らしいことですが、必須ではありません。

関数の例:

$('.myClass').on('click', function(event)
{
    // my function
});

score 159 · Accepted Answer

ブラウザが IE かどうかだけ知りたい場合は、次のようにします。

var isIE = false;
var ua = window.navigator.userAgent;
var old_ie = ua.indexOf('MSIE ');
var new_ie = ua.indexOf('Trident/');

if ((old_ie > -1) || (new_ie > -1)) {
    isIE = true;
}

if ( isIE ) {
    //IE specific code goes here
}

更新 1: より良い方法

今はこれをお勧めします。それはまだ非常に読みやすく、コードがはるかに少ないです:)

var ua = window.navigator.userAgent;
var isIE = /MSIE|Trident/.test(ua);

if ( isIE ) {
  //IE specific code goes here
}

短縮された回答のコメントで JohnnyFun に感謝します:)

更新2：CSSでのIEのテスト

まず、可能であれば@supports、ブラウザーが特定の CSS 機能をサポートしているかどうかを確認するために、JS の代わりにステートメントを使用する必要があります。

.element {
  /* styles for all browsers */
}

@supports (display: grid) {
  .element {
    /* styles for browsers that support display: grid */
  }
}

(IE はまったくサポートしておらず、ステートメント@supports内に配置されたスタイルを無視することに注意してください。)@supports

問題を解決できない場合は、@supportsこれを行うことができます。

// JS

var ua = window.navigator.userAgent;
var isIE = /MSIE|Trident/.test(ua);

if ( isIE ) {
  document.documentElement.classList.add('ie')
}

/* CSS */

.element {
  /* styles that apply everywhere */
}

.ie .element {
  /* styles that only apply in IE */
}

(注: classListJS は比較的新しく、IE ブラウザーのうち、IE11 でのみ動作すると思います。おそらく IE10 でも動作します。)

プロジェクトで SCSS (Sass) を使用している場合、これは次のように簡略化できます。

/* SCSS (Sass) */

.element {
  /* styles that apply everywhere */

  .ie & {
    /* styles that only apply in IE */
  }
}

更新 3: Microsoft Edge の追加 (非推奨)

リストに Microsoft Edge も追加する場合は、次の操作を実行できます。ただし、Edge は IE よりも優れたブラウザーであるため、お勧めしません。

var ua = window.navigator.userAgent;
var isIE = /MSIE|Trident|Edge\//.test(ua);

if ( isIE ) {
  //IE & Edge specific code goes here
}

score 32 · Accepted Answer

navigator オブジェクトを使用してユーザーナビゲーターを検出できます。jquery は必要ありません。以下の 4 つのコメントは既に含まれているため、このスニペットは期待どおりに機能します。

if (/MSIE (\d+\.\d+);/.test(navigator.userAgent) || navigator.userAgent.indexOf("Trident/") > -1 ){ 
 // Do stuff with Internet-Exploders ... :)
}

http://www.javascriptkit.com/javatutors/navigator.shtml

score 31 · Accepted Answer

これは、Angularjs チームが行っている方法です ( v 1.6.5 )。

var msie, // holds major version number for IE, or NaN if UA is not IE.

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

次に、次のような数値として使用する数行のコードが散らばっています。

if (event === 'input' && msie <= 11) return false;

と

if (enabled && msie < 8) {

score 10 · Accepted Answer

方法 01:
$.browser は jQuery バージョン 1.3 で廃止され、1.9 で削除されました

if ( $.browser.msie) {
  alert( "Hello! This is IE." );
}

方法 02:
条件付きコメントを使用する

<!--[if gte IE 8]>
<p>You're using a recent version of Internet Explorer.</p>
<![endif]-->

<!--[if lt IE 7]>
<p>Hm. You should upgrade your copy of Internet Explorer.</p>
<![endif]-->

<![if !IE]>
<p>You're not using Internet Explorer.</p>
<![endif]>

方法 03:

 /**
 * Returns the version of Internet Explorer or a -1
 * (indicating the use of another browser).
 */
function getInternetExplorerVersion()
{
    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 );
}

方法 04:
JavaScript/手動検出を使用する

/*
     Internet Explorer sniffer code to add class to body tag for IE version.
     Can be removed if your using something like Modernizr.
 */
 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]);

     //append class to body for use with browser support
     if (v > 4)
     {
         $('body').addClass('ie' + v);
     }

 }());

参照リンク

score 10 · Accepted Answer

上記の回答を使用して; シンプルで凝縮された戻り値のブール値:

var isIE = /(MSIE|Trident\/|Edge\/)/i.test(navigator.userAgent);

score 9 · Accepted Answer

ブラウザーが IE11 以前かどうかを確認したかっただけです。

function isCrappyIE() {
    var ua = window.navigator.userAgent;
    var crappyIE = false;
    var msie = ua.indexOf('MSIE ');
    if (msie > 0) {// IE 10 or older => return version number        
        crappyIE = true;
    }
    var trident = ua.indexOf('Trident/');
    if (trident > 0) {// IE 11 => return version number        
        crappyIE = true;
    }
    return crappyIE;
}   

if(!isCrappyIE()){console.table('not a crappy browser);}

score 4 · Accepted Answer

ユーザーエージェントを使用したくない場合は、ブラウザが IE かどうかを確認するためにこれを行うこともできます。コメント付きのコードは、実際には IE ブラウザーで実行され、"false" を "true" に変更します。

var isIE = /*@cc_on!@*/false;
if(isIE){
    //The browser is IE.
}else{
    //The browser is NOT IE.
}

score 4 · Accepted Answer

jquery バージョン >=1.9を使用している場合は、これを試してください。

var browser;
jQuery.uaMatch = function (ua) {
    ua = ua.toLowerCase();

    var match = /(chrome)[ \/]([\w.]+)/.exec(ua) ||
        /(webkit)[ \/]([\w.]+)/.exec(ua) ||
        /(opera)(?:.*version|)[ \/]([\w.]+)/.exec(ua) ||
        /(msie) ([\w.]+)/.exec(ua) || 
        ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) ||
       /(Trident)[\/]([\w.]+)/.exec(ua) || [];

    return {
        browser: match[1] || "",
        version: match[2] || "0"
    };
};
// Don't clobber any existing jQuery.browser in case it's different
if (!jQuery.browser) {
    matched = jQuery.uaMatch(navigator.userAgent);
    browser = {};

    if (matched.browser) {
        browser[matched.browser] = true;
        browser.version = matched.version;
    }

    // Chrome is Webkit, but Webkit is also Safari.
    if (browser.chrome) {
        browser.webkit = true;
    } else if (browser.webkit) {
        browser.safari = true;
    }

    jQuery.browser = browser;
}

jQuery バージョン <1.9 ($.browser は jQuery 1.9 で削除されました) を使用している場合は、代わりに次のコードを使用します。

$('.myClass').on('click', function (event) {
    if ($.browser.msie) {
        alert($.browser.version);
    }
});

score 3 · Accepted Answer

私はこれを使った

function notIE(){
    var ua = window.navigator.userAgent;
    if (ua.indexOf('Edge/') > 0 || 
        ua.indexOf('Trident/') > 0 || 
        ua.indexOf('MSIE ') > 0){
       return false;
    }else{
        return true;                
    }
}

score 2 · Accepted Answer

ここに多くの回答があります。私の意見を追加したいと思います。IE 11 は flexbox に関するお尻 (ここですべての問題と矛盾を参照してください) であり、ユーザーが IE ブラウザー (11 まで) を使用しているかどうかを確認する簡単な方法が本当に必要でしたが、Edge は実際には Edge であるためです。かなりいい。

ここでの回答に基づいて、後で使用できるグローバルブール変数を返す単純な関数を作成しました。IE の確認は非常に簡単です。

var isIE;
(function() {
    var ua = window.navigator.userAgent,
        msie = ua.indexOf('MSIE '),
        trident = ua.indexOf('Trident/');

    isIE = (msie > -1 || trident > -1) ? true : false;
})();

if (isIE) {
    alert("I am an Internet Explorer!");
}

この方法では、ルックアップを 1 回行うだけでよく、関数呼び出しごとに結果をフェッチするのではなく、結果を変数に格納します。(私が知る限り、ユーザーエージェントは DOM に関連していないため、ドキュメントがこのコードを実行する準備が整うまで待つ必要さえありません。)

score 2 · Accepted Answer

@SpiderCodeのソリューションはIE 11では機能しません。これは、特定の機能のブラウザ検出が必要なコードで今後使用する最良のソリューションです。

この変更リストによると、IE11 は MSIE として報告しなくなりました。これは、誤検出を避けるための意図的なものです。

それが IE であることを本当に知りたい場合にできることは、navigator.appName が (テストされていない); のような Netscape を返す場合、ユーザーエージェントで Trident/ 文字列を検出することです。

この回答のおかげで

function isIE()
{
  var rv = -1;
  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 );
  }
  else 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 );
  }
  return rv == -1 ? false: true;
}

score 1 · Accepted Answer

これは、User-Agent を見ようとせずに IE を検出する別の方法です。

var usingIE="__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR" in document;
alert("You are"+(usingIE?"":"n't")+" using Internet Explorer.");

サイトが IE で動作するかどうかをテストしていたときに偶然これを見つけ、デバッガーに移動してフォルダーアイコンをクリックしました。そこには私のスクリプトがあり、私Dynamic Scriptsが持っていなかったフォルダーもあります。開いてみると、たくさんのbrowsertools.library.jsファイルが見つかりました。それらの中に私は次のようなものを見つけました：

document.__IE_DEVTOOLBAR_CONSOLE_EVAL_RESULT = undefined;
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR = false;
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_ERRORCODE = undefined;
try{
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_RESULT = eval("\r\n//# sourceURL=browsertools://browsertools.library.js");
}
catch( eObj ){
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_ERRORCODE = eObj.number;
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_RESULT = eObj.message || eObj.description || eObj.toString();
document.__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR = true;
}

そこで、これらを使用して、ユーザーのブラウザーが IE かどうかをテストしました。これは、IE の正確なバージョンではなく、IE を使用しているかどうかを知りたい場合にのみ機能することに注意してください。

score 0 · Accepted Answer

このコードをドキュメント準備機能に配置しましたが、Internet Explorer でのみトリガーされます。Internet Explorer 11 でテスト済み。

var ua = window.navigator.userAgent;
ms_ie = /MSIE|Trident/.test(ua);
if ( ms_ie ) {
    //Do internet explorer exclusive behaviour here
}

score 0 · Accepted Answer

function msieversion() {
var ua = window.navigator.userAgent;
console.log(ua);
var msie = ua.indexOf("MSIE ");

if (msie > -1 || navigator.userAgent.match(/Trident.*rv:11\./)) { 
    // If Internet Explorer, return version numbe
    // You can do what you want only in IE in here.
    var version_number=parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)));
    if (isNaN(version_number)) {
        var rv_index=ua.indexOf("rv:");
        version_number=parseInt(ua.substring(rv_index+3,ua.indexOf(".",rv_index)));
    }
    console.log(version_number);
} else {       
    //other browser   
    console.log('otherbrowser');
}
}

You should see the result in console, please use chrome Inspect.

score 0 · Accepted Answer

すべての Internet Explorer (テスト済みの最終バージョン 12) を検出できます。

<script>
    var $userAgent = '';
    if(/MSIE/i['test'](navigator['userAgent'])==true||/rv/i['test'](navigator['userAgent'])==true||/Edge/i['test'](navigator['userAgent'])==true){
       $userAgent='ie';
    } else {
       $userAgent='other';
    }

    alert($userAgent);
</script>

こちらをご覧ください https://jsfiddle.net/v7npeLwe/

score -3 · Accepted Answer

を使用$.browserして、名前、ベンダー、およびバージョン情報を取得できます。

http://api.jquery.com/jQuery.browser/を参照してください。

javascript - ユーザーが IE を使用しているかどうかを確認する

33 に答える 33

更新 1: より良い方法

更新2：CSSでのIEのテスト

更新 3: Microsoft Edge の追加 (非推奨)

Related

Reference