~/devtools / escape
tool::escape
HTML 엔티티
인코더
HTML 특수문자를 엔티티로 인코딩하거나 엔티티를 원래 문자로 디코딩합니다. & → &, < → < 등 양방향 변환.
특수문자 참고표
| 문자 | 엔티티 | 설명 |
|---|---|---|
| & | & | 앰퍼샌드 |
| < | < | 부등호 (Less than) |
| > | > | 부등호 (Greater than) |
| " | " | 큰따옴표 |
| ' | ' | 작은따옴표 |
| | 줄바꿈 없는 공백 | |
| © | © | 저작권 |
| ® | ® | 등록 상표 |
| ™ | ™ | 상표 |
| € | € | 유로 |
| £ | £ | 파운드 |
| ¥ | ¥ | 엔/위안 |
| ° | ° | 도 (온도/각도) |
| ± | ± | 플러스마이너스 |
| × | × | 곱셈 |
| ÷ | ÷ | 나눗셈 |
ad · 300×250
// about this tool
HTML 엔티티 인코더에 대해
HTML에서 일부 문자는 특별한 의미를 가집니다. 예를 들어 <와 >는 태그를 정의하고, &는 엔티티의 시작을 나타냅니다. 이런 문자들을 텍스트 콘텐츠로 표시하려면 HTML 엔티티(<, >, & 등)로 변환해야 합니다. 그렇지 않으면 브라우저가 이를 HTML 마크업으로 해석해 예상치 못한 결과가 발생합니다.
HTML 엔티티는 &로 시작해서 ;로 끝나는 특수 코드입니다. 이름 기반(&)과 번호 기반(&) 두 가지 형식이 있으며, 표준 ASCII 범위를 벗어난 유니코드 문자도 엔티티로 표현할 수 있습니다. XSS(Cross-Site Scripting) 공격을 방지하기 위해 사용자 입력을 HTML에 삽입할 때 반드시 이스케이프 처리가 필요합니다.
이 도구는 HTML 특수문자를 엔티티로 인코딩하거나, 반대로 엔티티를 원래 문자로 디코딩합니다. 개발 중 HTML 템플릿 작성, 이메일 템플릿, 서버 사이드 렌더링 시 자주 필요한 작업을 빠르게 처리하고, 참고표에서 자주 쓰는 엔티티를 즉시 확인할 수 있습니다.
주요 사용 사례
- ▸사용자 입력을 HTML에 삽입하기 전 XSS 방지 이스케이프
- ▸이메일 HTML 템플릿에서 특수문자 올바르게 표시
- ▸HTML 소스 코드 예제를 웹 페이지에 그대로 보여주기
- ▸& < > " 등을 포함한 제목/설명 태그 작성
- ▸레거시 시스템의 HTML 엔티티 디코딩
자주 묻는 질문
Q. &와 &의 차이는 무엇인가요?
&는 이름 기반 엔티티이고, &은 문자 번호(코드포인트) 기반 엔티티입니다. 둘 다 같은 문자(&)를 나타내며 모든 최신 브라우저에서 동일하게 동작합니다.
Q. 모든 유니코드 문자를 엔티티로 변환해야 하나요?
UTF-8 인코딩된 HTML5에서는 &, <, >, ", '를 제외한 대부분의 유니코드 문자를 그대로 사용할 수 있습니다. 반드시 엔티티로 변환해야 하는 문자는 HTML 파서가 특수하게 처리하는 문자들만입니다.
Q. JavaScript에서 자동으로 HTML 이스케이프 하는 방법은?
textContent 프로퍼티를 사용하면 자동으로 이스케이프됩니다. React도 JSX에서 문자열을 자동 이스케이프합니다. dangerouslySetInnerHTML을 사용할 때만 수동 이스케이프가 필요합니다.