DevToolkit Pro

What Is HTML Entity Encoding

HTML entity encoding converts special characters to safe strings starting with & and ending with ;. It enables safe display of special characters in HTML.

Common HTML Entities

| Character | Entity Name | Entity Number | Description | |-----------|-------------|---------------|-------------| | < | < | < | Less-than | | > | > | > | Greater-than | | & | & | & | Ampersand | | " | " | " | Double quote | | ' | ' | ' | Single quote | | |   |   | Non-breaking space | | © | © | © | Copyright | | ® | ® | ® | Registered |

Why You Need HTML Entity Encoding

1. Prevent XSS attacks: User input like <script> becomes safe text
2. Display special characters: Show <, >, & in HTML content
3. Internationalization: Display special symbols and characters
4. Template engine output: Ensure dynamic content renders safely
5. Email templates: HTML emails need stricter escaping
6. Rich text editors: Safely save and display user content

XSS Prevention Example

Dangerous Unescaped Output

<!-- User input: <script>alert('XSS')</script> -->
<div>{{ user_input }}</div>

<!-- Rendered (DANGEROUS!) -->
<div><script>alert('XSS')</script></div>

Safe Escaped Output

<!-- User input: <script>alert('XSS')</script> -->
<div>&lt;script&gt;alert(&#39;XSS&#39;)&lt;/script&gt;</div>

<!-- Rendered (SAFE) -->
<div>&lt;script&gt;alert('XSS')&lt;/script&gt;</div>

How to Use an Online Tool

Using DevToolkit Pro's HTML Entity Encoder/Decoder:

1. Enter text to encode or decode
2. Choose mode:
   • Encode: Convert special characters to HTML entities
   • Decode: Convert HTML entities back to original characters
3. Supports both entity names and entity numbers

HTML Escaping in Code

JavaScript

// Encode
function escapeHtml(text) {
  const map = {
    '&': '&',
    '<': '&lt;',
    '>': '&gt;',
    '"': '&quot;',
    "'": '&#039;'
  };
  return text.replace(/[&<>"']/g, m => map[m]);
}

// Decode
function unescapeHtml(text) {
  const map = {
    '&amp;': '&',
    '&lt;': '<',
    '&gt;': '>',
    '&quot;': '"',
    '&#039;': "'"
  };
  return text.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, m => map[m]);
}

Python

import html

# Encode
text = '<script>alert("XSS")</script>'
encoded = html.escape(text)
# Output: &lt;script&gt;alert(&quot;XSS&quot;)&lt;/script&gt;

# Decode
decoded = html.unescape(encoded)
# Output: <script>alert("XSS")</script>

FAQ

What's the Difference Between HTML Encoding and URL Encoding?

HTML encoding handles special characters in HTML documents (< → <). URL encoding handles special characters in URLs (space → %20). They solve different problems.

Why Must & Be Escaped First?

& is the starting character of HTML entities. If & isn't escaped first, subsequent escape sequences get misinterpreted. For example: < without escaping & would be treated as an entity itself.

Does React Auto-Escape?

React automatically escapes variables in JSX. But if you use dangerouslySetInnerHTML, no escaping occurs — you must handle it manually.

This article is brought to you by DevToolkit Pro. More developer tools at the homepage.