Last updated
What Are HTML Entities?
HTML entities are special codes used to represent characters that have special meaning
in HTML or that cannot be typed directly. They start with & and end with ;.
There are two forms: named entities (&) and numeric entities
(& decimal or & hexadecimal).
Essential HTML Entities
| Character | Named Entity | Numeric | Use Case |
|---|---|---|---|
| & | & | & | Ampersand in text/attributes |
| < | < | < | Less-than sign (prevents tag parsing) |
| > | > | > | Greater-than sign |
| " | " | " | Double quote in attributes |
| ' | ' | ' | Single quote in attributes |
|   | Non-breaking space | |
| © | © | © | Copyright symbol |
| → | → | → | Right arrow |
Encoding and Decoding in JavaScript
// Encode HTML entities
function encodeHtmlEntities(str) {
return str
.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''');
}
// Decode HTML entities (using DOM)
function decodeHtmlEntities(str) {
const el = document.createElement('textarea');
el.innerHTML = str;
return el.value;
}
// Encode all non-ASCII characters as numeric entities
function encodeNonAscii(str) {
return str.replace(/[^ -]/g, char =>
`${char.charCodeAt(0)};`
);
}
encodeHtmlEntities('<script>alert("xss")</script>');
// → '<script>alert("xss")</script>'