IE 8 대응 정리

HTML

Javascript

catch

증상

function Hello() {
  var error = "Hello error";

  var testFunction = function() {
    alert(error);

    try {} 
    catch(error) {}
  }

  testFunction();
}

Hello();

다른 모든 브라우저에서 "Hello error" 메세지를 띄우는데 IE8 이하에서는 undefined 가 나온다.

원인

IE8 에서는 catch 절이 보이면 그 argument들을 가지고 일종의 호이스팅 비슷한 동작을 하는 것으로 보인다. 위 예제에서 다른 브라우저라면 alert(error)가 호출되면 Hello의 error을 찾아 스코프를 타고 올라가지만 IE8에서는 호이스팅때문에 암시적으로 선언된 var error를 보게 되는 것. 따라서 undefined가 나온다.

해결책

function Hello() {
  var error = "Hello error";

  var testFunction = function() {
    alert(error);

    try {} 
    catch(exception) {}
  }

  testFunction();
}

Hello();

이름을 다르게 관리해야 한다.

예약어

증상

function Hello() {}

Hello.prototype.catch = function(error) {
  console.log(error);
}

var hello = new Hello();
hello.catch("call hello.catch");

위와 같은 코드를 크롬이나 IE9+ 에서 실행하게 되면 아무런 문제가 없지만 IE8에서 실행하게 되면 Expected identifier 이라는 에러를 보게 됨

원인

IE8은 ECMAScript 3까지만 지원하는데, ES3에서는 예약어를 . 아래에 쓸 수 없기 때문

해결책

function Hello() {}

Hello.prototype["catch"] = function(error) {
  console.log(error);
}

var hello = new Hello();
hello["catch"]("call hello.catch");

위 예제처럼 [] 대괄호 문법으로 바꾸면 된다.

CSS