[javascript] 사용자가 IE를 사용하고 있는지 확인

JAVASCRIPT / 글쓴이

특정 클래스가있는 div를 클릭하여 아래와 같은 함수를 호출합니다.

사용자가 Internet Explorer를 사용하는 경우 기능을 시작할 때 확인할 수 있고 다른 브라우저를 사용하는 경우 IE 사용자에게만 실행되도록 중단 / 취소 할 수있는 방법이 있습니까? 여기에있는 사용자는 모두 IE8 이상 버전이므로 IE7 이하 버전을 다루지 않아도됩니다.

그들이 사용하는 브라우저를 알 수 있다면 훌륭하지만 필수는 아닙니다.

기능 예 :

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

답변

아래 JavaScript 방법을 사용하십시오. 

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

    if (msie > 0) // If Internet Explorer, return version number
    {
        alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
    }
    else  // If another browser, return 0
    {
        alert('otherbrowser');
    }

    return false;
}

아래의 Microsoft 지원 사이트에서 자세한 내용을 확인할 수 있습니다.

스크립트에서 브라우저 버전을 확인하는 방법

업데이트 : (IE 11 지원)

function msieversion() {

    var ua = window.navigator.userAgent;
    var msie = ua.indexOf("MSIE ");

    if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))  // If Internet Explorer, return version number
    {
        alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
    }
    else  // If another browser, return 0
    {
        alert('otherbrowser');
    }

    return false;
}

답변

몇 년 후 Edge 브라우저는 이제 Chromium을 렌더링 엔진으로 사용합니다.
슬프게도 IE 11 확인은 여전히 ​​중요합니다.

고대 버전의 IE는 사라져야하므로보다 간단한 방법이 있습니다.

if (window.document.documentMode) {
  // Do IE stuff
}

여기 내 옛 대답이 있습니다 (2014) :

Edge에서 사용자 에이전트 문자열 이 변경되었습니다.

/**
 * detect IEEdge
 * returns version of IE/Edge or false, if browser is not a Microsoft browser
 */
function detectIEEdge() {
    var ua = window.navigator.userAgent;

    var msie = ua.indexOf('MSIE ');
    if (msie > 0) {
        // IE 10 or older => return version number
        return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
    }

    var trident = ua.indexOf('Trident/');
    if (trident > 0) {
        // IE 11 => return version number
        var rv = ua.indexOf('rv:');
        return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
    }

    var edge = ua.indexOf('Edge/');
    if (edge > 0) {
       // Edge => return version number
       return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
    }

    // other browser
    return false;
}

샘플 사용법 :

alert('IEEdge ' + detectIEEdge());

IE 10의 기본 문자열 :

Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)

IE 11의 기본 문자열 :

Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko

Edge 12의 기본 문자열 :

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의 기본 문자열 (thx @DrCord) :

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

Edge 14의 기본 문자열 :

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/14.14300

Edge 15의 기본 문자열 :

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36 Edge/15.15063

Edge 16의 기본 문자열 :

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299

Edge 17의 기본 문자열 :

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36 Edge/17.17134

Edge 18의 기본 문자열 (삽입 미리보기) :

Mozilla/5.0 (Windows NT 10.0; Win64; x64; ServiceUI 14) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36 Edge/18.17730

CodePen에서 테스트 :

http://codepen.io/gapcode/pen/vEJNZN

답변

브라우저가 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
}

답변

true모든 버전의 Internet Explorer에 대해 다음을 반환 합니다.

function isIE(userAgent) {
  userAgent = userAgent || navigator.userAgent;
  return userAgent.indexOf("MSIE ") > -1 || userAgent.indexOf("Trident/") > -1 || userAgent.indexOf("Edge/") > -1;
}

이 userAgent매개 변수는 선택 사항이며 기본값은 브라우저의 사용자 에이전트입니다.

답변

이것이 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) {

답변

네비게이터 객체를 사용하여 사용자 탐색기를 감지 할 수 있으며 jquery가 필요하지 않습니다.

<script type="text/javascript">

if (/MSIE (\d+\.\d+);/.test(navigator.userAgent) || navigator.userAgent.indexOf("Trident/") > -1 ){

 // Do stuff with Internet-Exploders ... :)
}

</script>

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

답변

위의 답변을 사용하여; 단순 및 요약 반환 부울 ​​:

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