자바스크립트를 작성할 때 항상은 아니지만 자바스크립트를 작성할때 HTML 주석 ' <!-- ... //--> 로 둘러 쏴주는것을 볼수 있다.


이것은 자바스크립트를 지원하지 않는 브라우저에서 자바스크립트의 내용이 그대로 출력되지 않기 위해서이다.


'Programming' 카테고리의 다른 글

Android Jericho Parser  (0) 2012.08.14
JavaScript Bible - Danny Goodman  (0) 2012.07.07
자바스크립트 안에 HTML주석이 들어가는 이유!  (0) 2012.05.01
Adobe AIR Cheat sheet  (0) 2012.02.27
Adobe AIR 3 / 기술 사양  (0) 2012.02.06
11월 17일 랩실 C언어 교육  (0) 2009.11.17
홀태그란 <b>text</b> 처럼이 아닌 태그 종료후 닫는 태그가 없는 <img>와 같은 태그를 말합니다.

  • area
  • base
  • br
  • col
  • img
  • embed
  • hr
  • param
  • meta
  • source
  • keygen
  • link
  • input
  • command
  이 홀태그들은 XHTML문법에서는 <br />처럼 홀태그 끝에 닫는 태그를 넣어야지만
HTML문법에서는 그냥 써도 됩니다.

HTML5문법에서는 홀태그에 끝을 닫던 안닫던 상관없습니다. 
HTML을 작성함에 있어 특수문자(ex, &[앰퍼샌트], ©[저작권기호])를 특수문자로만 인식되게끔 하기 위해 정의해놓은 것이라고 할 수있습니다.

예를 들어 HTML문서에서 텍스트 안에 꺽쇠(<.>)가 들어갔을때 엔티티 코드를 사용하지 않으면 이 꺽쇠가 코드로 인식되는 문제가 발생됩니다.

W3C에서도 HTML 문서 작성시 특수문자는 반드시 엔티티코드로 치환할것을 권고하고 있습니다.

자주쓰는 엔티티코드 :
Character Entity Name Entity Number Description
  &nbsp; &#160; Inserts A Non-Breaking Blank Space
& &amp; &#38; Ampersand
" &quot; &#34; Quotation Mark
© &copy; &#169; Copyright Symbol
® &reg; &#174; Registered Symbol
&trade; &#153; Trademark Symbol
&ldquo; &#147; Opening Double Quotes
&rdquo; &#148; Closing Double Quotes
&lsquo; &#145; Opening Single Quote Mark
&rsquo; &#146; Closing Single Quote Mark
« &laquo; &#171; Angle Quotation Mark (Left)
» &raquo; &#187; Angle Quotation Mark (Right)
&lsaquo; &#8249; Single Left Angle Quotation
&rsaquo; &#8250; Single Right Angle Quotation
§ &sect; &#167; Section Symbol
&para; &#182; Paragraph Symbol
&bull; &#149; Big List Dot
· &middot; &#183; Medium List Dot
&hellip; &#8230; Horizontal Ellipsis
| &#124; Vertical Bar
¦ &brvbar; &#166; Broken Vertical Bar
&ndash; &#150; En-Dash
&mdash; &#151; Em-Dash

자세한 내용은 http://entitycode.com/ 를 참고하기 바랍니다.
우리는 이런 암호화된 소스를 만나게 되면 조금 당혹스러워진다.
<script language="javascript">document.write(unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E"));</script> ♬바람개비™

실행해 보자
♬바람개비™
어디서 많이 본것이다.

이제부터 풀어봅시다.
암호화된 소스
<script language="javascript">document.write(unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E\x20\x0D\x0A"));</script> ♬바람개비™

방법 1.  document.write 대신 alert 을 넣어봅시다.
<script language="javascript">alert(unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E"));</script> ♬바람개비™

alert 창 예제보기


방법 2.  document.write("<xmp>"); 이것을 앞부분에 넣어봅시다
<script language="javascript"> document.write("<xmp>"); document.write(unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E"));"</xmp>"</script> ♬바람개비™

결과  -  <img src="http://combaduk.com.ne.kr/pic/baram.gif"> ♬바람개비™


방법 3.  document.write(★unescape의 ★대신에 "<xmp>"+ 을 넣어봅시다
<script language="javascript">document.write("<xmp>"+ unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E"));</script> ♬바람개비™</xmp>

조금 쉽게한다면 document.write(★unescape의 ★대신에 "<xmp>"+ 이것만 넣으면 됩니다. 뒤에 붙는 </xmp> 을 생략한다면 조금쉽겠죠
<script language="javascript">document.write("<xmp>"+unescape("\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6F\x6D\x62\x61\x64\x75\x6B\x2E\x63\x6F\x6D\x2E\x6E\x65\x2E\x6B\x72\x2F\x70\x69\x63\x2F\x62\x61\x72\x61\x6D\x2E\x67\x69\x66\x22\x3E"));</script> ♬바람개비™

결과  -  <img src="http://combaduk.com.ne.kr/pic/baram.gif"> ♬바람개비™


이제 원하는 소스를 태그연습장에 복사해서 넣고 결과보기 하시면 됩니다.

다른방법으로 인코딩된것도 document.write("<xmp>");   이것을 앞부분에 넣어주면 되더군요  


HTML Encoder 얻을수있는곳
http://blog.naver.com/sem7877.do?Redirect=Log&logNo=140003432743
( HTML Encoder는  한글 깨지는 문제가 발생합니다. )

출처 : http://www.musictag.net/zboard/zboard.php?id=bang_baram&no=5
  1. 김건웅 2007.01.13 01:24 신고

    이거 뮤직태그넷 http://www.musictag.net/
    여기에 있는거 아닌감? ㅋ
    바람개비 보고 바로 생각났음 ㅋ
    나도 옛날에 요기 쫌 애용했었는데....
    나도 블로그나 해볼까 생각중인데 이글루스 에서... ㅋ

    • Favicon of http://bestmylife.net BlogIcon Lunik 2007.01.13 14:13 신고

      이글루스 써보니깐 별로더라.ㅋㅋ

      티스토리 추천!!

+ Recent posts