아래의 코드를 보자.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>G-Test 5</title>
</head>
<body>
 <script type="text/javascript">
//<![CDATA[
  var testval = "<!--";
//]]>
 </script>
 <div>겐도 오빠 사랑해</div>
 <!-- 정말? -->
 <div>ㅇㅇ</div>
 <script type="text/javascript">
//<![CDATA[
  var testval2 = "-->";
//]]>
 </script>
</body>
</html>

파이어폭스는 나의 사랑을 잘 표현해 주고 있다.
사용자 삽입 이미지

FireFox 2 on Vista


허나 IE 7. 로딩부터 심상치 않다.
사용자 삽입 이미지

IE7 on Vista

그리고는 깔끔한 흰 화면을 보여준다.
사파리는 거의 기대를 말자. "<!--"가 미리 처리되어 많은 브라우저들이 "-->"까지 날려준다. 위처럼 script 영역을 벗어나는 주석태그가 있는 경우 오동작 한다. 오동작이 맞는지는 모르겠다. HTML Spec을 아무리 읽어봐도 어느것을 먼저 해석해야 하는지에 대해선 모르겠다.

아무튼 자바스크립트 영역에 뭔가 출력할땐 조심하자.

저 문서의 타이틀에서 살짝 보이듯이 곧 "G-Test Pattern V5" 공개하겠습니다.

'개발&Development > ' 카테고리의 다른 글

G-Test Pattern  (0) 2008.05.26
CDATA는 운이 좋으면 해석될 뿐  (4) 2008.05.25
웹 접근성에 대한 단상들  (0) 2008.05.05
사파리의 앵커 버그  (3) 2008.03.20
Safari 3.1 updates  (0) 2008.03.18
벨리데이터는 벨리데이터일뿐  (4) 2008.03.12
  1. Commented by daybreaker at 2008.05.26 05:57

    헐.... 이런 문제가 있군요;;;;; 덜덜덜
    그래도 string literal로 보는 게 맞지 않을까 싶은데....ㅠㅠ;;

    테스트 패턴에 이어 해결 방법(?)도 알려주시면 더욱 좋을 것 같군요. (혹시 해결 방법이 저런 문자열을 출력하지 말자..라거나 entity 인코딩하자...라면..-_-a) 이를 테면 strict DTD에서는 결과가 다르다든지 IE8은 어떤지라든지 content-type에 application/xhtml+xml을 지정하면 어떻게 바뀐다든지 말이죠..; (너무 많은 걸 요구했나요..-_-)

    ps. 스크린샷에서 구글 툴바, 웹디벨로퍼 확장기능은 굳이 모자이크 처리하지 않으셔도..=3=3

    • Commented by 겐도 at 2008.05.26 06:33

      상황에 따라 처리방법이 다를 수 있습니다. 그래서 문제만 지적하고 해결책은 제시할 수 없습니다. 특히 타입 같은 것은 이미 레거시가 있어가 제한이 있어 쉽게 바꿀 수 있는 부분은 아니죠. 현재 상황에서 어떻게든 저런 스트링들이 잘 처리되도록 최선을 다할 뿐입니다.
      모자익 처리는... 그냥 심심해서요 :)

  2. Commented by 부니기 at 2008.10.31 18:23

    cdata로 검색하다가 들어왔습니다. 아주 가끔 눈팅(?)만 했었는데, 한가지 물어볼 것이 있어서 댓글 답니다.
    위의 코드라면 주석처리 문이 중첩되는데, 중첩되면 안된다고 알고 있습니다.
    <!-- <!-- 정말? --> -->
    IE에서의 문제가 혹시 그런 문제가 아닐지...
    제가 잘 못 알고 있다면, 가르침을 부탁드립니다. ^^;

    • Commented by 겐도 at 2008.10.31 21:35

      네 주석은 중첩을 허용하지 않습니다. 심지어 주석중간에 연속된 하이픈("--")이 나와서도 안됩니다.
      하지만 위의 케이스는 처음의 주석 시작문구가("<!--") 태그의 시작으로 보아야 하는지 CDATA영역이니 무시해야 되는지에 대한 차이입니다. 위에 트랙백을 따라가서 읽어 보시면 잘 설명이 되어 있는데 왠만하면 브라우저들이 무시하고는 주석시작 태그로 인식합니다.
      즉 스크립트에 데이터를 그대로 스트링으로 적을 때 단순히 따옴표 등 뿐만이 아니라 연속된 하이픈도 신경써 줘야 한다는 의미로 보시면 됩니다. 기존의 단순한 이스케이핑 함수들로는 운나쁘면 스크립트 에러가 납니다.