IE문서모드 브라우저 모드 설정

과거 HTTP 표준이 지켜지지 않을때 IE가 시장을 지배한탓에
IE8에는 여러가지 모드가 있다.
일반적으로 잘 알려진 것이 호환성 모드이다.
IE8이 표준에 대한 지원을 강화함에 따라 이전 전용코드들에 대해서 문제가 발생하는데 이를 해결하기위한 땜빵이 호환성 모드이다.
표준과 IE전용을 적당히 석어서 랜더링한다.

IE8에보면 F12로 개발자모드 창을 띄울수있다.
그곳에 보면 모드가 2종류가있다.
    브라우져모드 : 7 / 8 / 8호환성
    문서모드 : 7표준 /8표준 / 쿼크

이것은 "현재의 문서를 어떤방식으로 랜더링을 할것인가?" 를 선택하는것이다.
브라우져 모드는 브라우져의 기본 셋팅을 정하는것이고
문서모드는 자신의 랜더링방식을 명시하는것이다.
(기능적으로 둘은 동일한데 어디서 정의를 하는가의 차이이다.)

브라우져 모드의 설정은 메뉴에 호환성보기가 있고 레지스트리를 보면
[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_NATIVE_DOCUMENT_MODE]
"MyApplication.exe"=dword:13880
이런 형태로 저장되어있다.

문서모드는 문서의 해더에 아래와 같이 설정하면 브라우져모드의 설정보다 우선하여 적용된다.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
 
DTD 정의가 있는 경우: Standard Mode
DTD 정의가 없는 경우: Quirks Mode
 Standard Mode 설정 (DTD 정의가 있는 경우)
 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

 
설정의 세부 값은 아래와 같다.
 Quirks Mode 설정 (DTD 정의가 없는 경우)
 <meta http-equiv="X-UA-Compatible" content="IE=5" />
 Internet Explorer 7 Standards 모드
 <meta http-equiv="X-UA-Compatible" content="IE=7" />
 Internet Explorer 8 Standards 모드
 <meta http-equiv="X-UA-Compatible" content="IE=8" />
 가장 최신 Internet Explorer 버전의 Standards 모드
 <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

 

=========================================================================================================

그리하야... 내가 짠 소스뮤,

 

<meta http-equiv="Content-Type"  content="text/html; charset=EUC-KR" />   
<meta http-equiv="Page-Enter" content="BlendTrans(Duration=0.4)"/>
<meta http-equiv="Page-Exit" content="BlendTrans(Duration=0.4)"/>
<meta http-equiv="X-UA-Compatible" id="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" id="browser_mode" content="IE=9" />
<script>
var name = navigator.appName, ver = navigator.appVersion,
ver_int = parseInt(navigator.appVersion), ua = navigator.userAgent, infostr;

//alert(ver);

if(name == "Microsoft Internet Explorer"){
 if(ver.indexOf("MSIE 9.0") != -1)  {
  document.getElementById("X-UA-Compatible").setAttribute("content", "IE=9");
 // document.getElementById("browser_mode").setAttribute("content", "IE=EmulateIE9");
 }else if(ver.indexOf("MSIE 8.0") != -1)  {
  document.getElementById("X-UA-Compatible").setAttribute("content", "IE=8;IE8");
 // document.getElementById("browser_mode").setAttribute("content", "IE=EmulateIE8");
 }else if(ver.indexOf("MSIE 7.0") != -1)  {
  document.getElementById("X-UA-Compatible").setAttribute("content", "IE=7");
 }else{
  document.getElementById("X-UA-Compatible").setAttribute("content", "IE=edge");
 }
}

</script>

원문출처 : http://blog.naver.com/PostView.nhn?blogId=xcynicx&logNo=110129450755