728x90
반응형
안녕하세요?
오늘은 HTML 안에서 특수문자안의 특수문자들을 올바르고 명확하게 표현하기 위한 코드를 알아보겠습니다.
이렇게 알아보게된 배경은 아래와 같았습니다.
별도의 파일로 템플릿 스크립트를 저장해 놓고, ckeditor를 오픈하면 이를 불러와 HTML 템플릿을 뿌려주는 부분 이었는데요.
이 템플릿을 활용해 내용 까지도 잘 작성이 되는데, 여기의 내용을 getHtml 함수로 뽑아내어 DB에 저장하고 이를 전송하는데 내용에 font 쪽 스크립트가 "로 감싸져 있어서 "" 안에 ""가 들어가다 보니 파싱할 때 애러가 발생했습니다.
분명히 템플릿에 지정한 스크립트는 ' 따옴표였는데, 이를 getHtml로 뽑아내면 " 쌍따옴표가 되는 신기한 현상이 발생하더군요.
그래서 명확하게 지정하기 위해 HTML에서 특수문자를 어떻게 명확하게 작성할 수 있는지를 알아보던 중 아래의 HTML 특수문자 코드표를 찾게 되었습니다.
| 표현문자 | 숫자표현 | 문자표현 | 설명 |
| - | �- | - | 사용하지 않음 |
| space | 	 | - | 수평탭 |
| space | | - | 줄 삽입 |
| - | - | - | 사용하지 않음 |
| space |   | - | 여백 |
| ! | ! | - | 느낌표 |
| " | " | " | 따옴표 |
| # | # | - | 숫자기호 |
| $ | $ | - | 달러 |
| % | % | - | 백분율 기호 |
| & | & | & | Ampersand |
| ' | ' | - | 작은 따옴표 |
| ( | ( | - | 왼쪽 괄호 |
| ) | ) | - | 오른쪽 괄호 |
| * | * | - | 아스트릭 |
| + | + | - | 더하기 기호 |
| , | , | - | 쉼표 |
| - | - | - | Hyphen |
| . | . | - | 마침표 |
| / | / | - | Solidus (slash) |
| 0 - 9 | 0-9 | - | 0부터 9까지 |
| : | : | - | 콜론 |
| ; | ; | - | 세미콜론 |
| < | < | < | 보다 작은 |
| = | = | - | 등호 |
| > | > | > | 보다 큰 |
| ? | ? | - | 물음표 |
| @ | @ | - | Commercial at |
| A - Z | A-Z | - | A부터 Z까지 |
| [ | [ | - | 왼쪽 대괄호 |
| \ | \ | - | 역슬래쉬 |
| ] | ] | - | 오른쪽 대괄호 |
| ^ | ^ | - | 탈자부호 |
| _ | _ | - | 수평선 |
| ` | ` | - | Acute accent |
| a - z | a-z | - | a부터 z까지 |
| { | { | - | 왼쪽 중괄호 |
| | | | | - | 수직선 |
| } | } | - | 오른쪽 중괄호 |
| ~ | ~ | - | 꼬리표 |
| - | -Ÿ | - | 사용하지 않음 |
|   | | Non-breaking space | |
| ¡ | ¡ | ¡ | 거꾸로된 느낌표 |
| ￠ | ¢ | ¢ | 센트 기호 |
| ￡ | £ | £ | 파운드 |
| ¤ | ¤ | ¤ | 현재 환율 |
| ￥ | ¥ | ¥ | 엔 |
| | | ¦ | ¦ | 끊어진 수직선 |
| § | § | § | 섹션 기호 |
| ¨ | ¨ | ¨ | 움라우트 |
| ⓒ | © | © | 저작권 |
| ª | ª | ª | Feminine ordinal |
| ≪ | « | « | 왼쪽 꺾인 괄호 |
| ￢ | ¬ | ¬ | 부정 |
| ­ | ­ | Soft hyphen | |
| ? | ® | ® | 등록상표 |
| &hibar; | ¯ | ¯ | Macron accent |
| ° | ° | ° | Degree sign |
| ± | ± | ± | Plus or minus |
| ² | ² | ² | Superscript two |
| ³ | ³ | ³ | Superscript three |
| ´ | ´ | ´ | Acute accent |
| μ | µ | µ | Micro sign (Mu) |
| ¶ | ¶ | ¶ | 문단기호 |
| · | · | · | Middle dot |
| ¸ | ¸ | ¸ | Cedilla |
| ¹ | ¹ | ¹ | Superscript one |
| º | º | º | Masculine ordinal |
| ≫ | » | » | 오른쪽 꺾인 괄호 |
| ¼ | ¼ | ¼ | 4분의 1 |
| ½ | ½ | ½ | 2분의 1 |
| ¾ | ¾ | ¾ | 4분의 3 |
| ¿ | ¿ | ¿ | 거꾸로된 물음표 |
| A | À | À | Capital A, grave accent |
| A | Á | Á | Capital A, acute accent |
| A | Â | Â | Capital A, circumflex accent |
| A | Ã | Ã | Capital A, tilde |
| A | Ä | Ä | Capital A, dieresis or umlaut mark |
| A | Å | Å | Capital A, ring (Angstrom) |
| Æ | Æ | Æ | Capital AE diphthong (ligature) |
| C | Ç | Ç | Capital C, cedilla |
| E | È | È | Capital E, grave accent |
| E | É | É | Capital E, acute accent |
| E | Ê | Ê | Capital E, circumflex accent |
| E | Ë | Ë | Capital E, dieresis or umlaut mark |
| I | Ì | Ì | Capital I, grave accent |
| I | Í | Í | Capital I, acute accent |
| I | Î | Î | Capital I, circumflex accent |
| I | Ï | Ï | Capital I, dieresis or umlaut mark |
| Ð | Ð | Ð | Capital Eth, Icelandic |
| N | Ñ | Ñ | Capital N, tilde |
| O | Ò | Ò | Capital O, grave accent |
| O | Ó | Ó | Capital O, acute accent |
| O | Ô | Ô | Capital O, circumflex accent |
| O | Õ | Õ | Capital O, tilde |
| O | Ö | Ö | Capital O, dieresis or umlaut mark |
| × | × | × | Multiply sign |
| Ø | Ø | Ø | width="130"Capital O, slash |
| U | Ù | Ù | Capital U, grave accent |
| U | Ú | Ú | Capital U, acute accent |
| U | Û | Û | Capital U, circumflex accent |
| U | Ü | Ü | Capital U, dieresis or umlaut mark |
| Y | Ý | Ý | Capital Y, acute accent |
| Þ | Þ | Þ | Capital Thorn, Icelandic |
| ß | ß | ß | Small sharp s, German (sz ligature) |
| a | à | à | Small a, grave accent |
| a | á | á | Small a, acute accent |
| a | â | â | Small a, circumflex accent |
| a | ã | ã | Small a, tilde |
| a | ä | ä | Small a, dieresis or umlaut mark |
| a | å | å | Small a, ring |
| æ | æ | æ | Small ae diphthong (ligature) |
| c | ç | ç | Small c, cedilla |
| e | è | è | Small e, grave accent |
| e | é | é | Small e, acute accent |
| e | ê | ê | Small e, circumflex accent |
| e | ë | ë | Small e, dieresis or umlaut mark |
| i | ì | ì | Small i, grave accent |
| i | í | í | Small i, acute accent |
| i | î | î | Small i, circumflex accent |
| i | ï | ï | Small i, dieresis or umlaut mark |
| ð | ð | ð | Small eth, Icelandic |
| n | ñ | ñ | Small n, tilde |
| o | ò | ò | Small o, grave accent |
| o | ó | ó | Small o, acute accent |
| o | ô | ô | Small o, circumflex accent |
| o | õ | õ | Small o, tilde |
| o | ö | ö | Small o, dieresis or umlaut mark |
| ÷ | ÷ | ÷ | Division sign |
| ø | ø | ø | Small o, slash |
| u | ù | ù | Small u, grave accent |
| u | ú | ú | Small u, acute accent |
| u | û | û | Small u, circumflex accent |
| u | ü | ü | Small u, dieresis or umlaut mark |
| y | ý | ý | Small y, acute accent |
| þ | þ | þ | Small thorn, Icelandic |
| y | ÿ | ÿ | Small y, dieresis or umlaut mark |
위 내역을 참고하셔서 변경해보시고 한번 테스트 해보세요!
긴 글 읽어주셔서 감사합니다.
728x90
반응형