HTML Entity Encoder / Decoder
| Char | Named Entity | Numeric | Description |
|---|
Nếu bạn đã từng copy đoạn code HTML vào một cái textarea mà nó tự dưng "chạy" luôn thay vì hiển thị nguyên văn bản — hoặc paste ký tự <, > vào nội dung web mà trình duyệt hiểu nhầm thành thẻ HTML — thì bạn đã gặp đúng vấn đề mà tool này sinh ra để giải quyết.
HTML Entity Encoder giúp bạn chuyển đổi các ký tự đặc biệt sang dạng HTML entity an toàn, và ngược lại — decode entity về lại ký tự gốc. Nhanh, chính xác, không cần biết code.
HTML entity là gì?
Trong HTML, một số ký tự có ý nghĩa đặc biệt với trình duyệt. Ví dụ, dấu < báo hiệu bắt đầu một thẻ HTML, dấu & bắt đầu một entity. Nếu bạn muốn hiển thị những ký tự này thay vì để trình duyệt xử lý chúng, bạn cần dùng HTML entity — một chuỗi ký tự thay thế bắt đầu bằng & và kết thúc bằng ;.
| Ký tự | HTML Entity | Tên entity |
|---|---|---|
< (nhỏ hơn) | < | Less than |
> (lớn hơn) | > | Greater than |
& (ampersand) | & | Ampersand |
" (nháy kép) | " | Quotation mark |
' (nháy đơn) | ' | Apostrophe |
| Dấu cách không ngắt | | Non-breaking space |
© (bản quyền) | © | Copyright |
® (nhãn hiệu) | ® | Registered trademark |
Ngoài dạng tên (<), HTML entity còn có thể viết dạng số thập phân (<) hoặc số hex (<) — cả ba đều cho kết quả giống nhau khi trình duyệt render.
Cách sử dụng tool
Thao tác chỉ mất vài giây:
- Encode: Dán đoạn văn bản hoặc code HTML vào ô nhập liệu → chọn Encode → nhận về chuỗi đã thay thế toàn bộ ký tự đặc biệt bằng HTML entity tương ứng.
- Decode: Dán chuỗi chứa HTML entity vào ô nhập liệu → chọn Decode → nhận về ký tự gốc dễ đọc.
- Nhấn Copy để sao chép kết quả vào clipboard.
Khi nào cần dùng HTML entity encoder?
| Tình huống | Encode hay Decode? |
|---|---|
| Hiển thị đoạn code HTML/XML trong bài viết mà không bị trình duyệt xử lý | ✅ Encode |
| Chèn ký tự đặc biệt vào nội dung WordPress, CMS an toàn | ✅ Encode |
| Ngăn XSS (Cross-site Scripting) khi render dữ liệu người dùng nhập vào trang web | ✅ Encode |
| Đọc source HTML có nhiều entity, muốn xem nội dung gốc | ✅ Decode |
| Debug template email HTML chứa nhiều entity khó đọc | ✅ Decode |
| Viết tài liệu kỹ thuật có ví dụ code HTML | ✅ Encode |
Ví dụ thực tế
Encode: hiển thị code HTML trong bài viết
Giả sử bạn muốn viết bài hướng dẫn HTML và cần hiển thị đoạn code sau trong trang web:
Nếu paste thẳng vào nội dung mà không encode, trình duyệt sẽ render thành đường link thật thay vì hiển thị code. Sau khi encode, đoạn code trở thành:
Lúc này trình duyệt sẽ hiển thị đúng văn bản code thay vì chạy nó.
Decode: đọc nội dung từ email template
Bạn nhận được một đoạn HTML template từ hệ thống email marketing:
Decode ra để đọc cho dễ hiểu:
HTML entity và bảo mật web (XSS)
Một trong những ứng dụng quan trọng nhất của HTML encoding là bảo vệ website khỏi tấn công XSS (Cross-site Scripting). Đây là kiểu tấn công mà hacker chèn đoạn JavaScript độc hại vào nội dung trang web thông qua các ô input.
Ví dụ, nếu người dùng nhập vào ô comment:
Và server render thẳng ra trang HTML mà không encode — đoạn script đó sẽ chạy thật trong trình duyệt của người dùng khác. Nhưng nếu encode trước khi render, nó chỉ hiển thị như văn bản vô hại:
Tool này giúp bạn kiểm tra và xử lý nhanh những đoạn dữ liệu như vậy trong quá trình phát triển hoặc audit website.
Một vài lưu ý khi dùng
- Không encode toàn bộ trang HTML: Chỉ encode nội dung văn bản bên trong các thẻ, không encode cả thẻ HTML — vì nếu encode thẻ
<p>thì trình duyệt sẽ không hiểu cấu trúc trang nữa. - Encode khác Escape: Trong lập trình, "escape" và "encode" đôi khi dùng lẫn nhau nhưng không hoàn toàn giống nhau. HTML entity encoding cụ thể là dành cho ngữ cảnh HTML.
- Dữ liệu xử lý tại chỗ: Tool này chạy hoàn toàn trên trình duyệt của bạn, không gửi bất kỳ dữ liệu nào lên server — an toàn khi dùng với nội dung nhạy cảm.
Kết luận
HTML Entity Encoder là một trong những tool nhỏ nhưng không thể thiếu với ai làm việc với web — từ developer, content writer đến người quản trị WordPress. Thay vì nhớ entity của từng ký tự hay tra bảng mỗi lần, cứ paste vào đây là xong.
Khám phá thêm các tool hữu ích khác tại codetuthub.com/tools — tất cả miễn phí, không cần đăng ký.