~/devtools / escape
tool::escape
HTMLエンティティ
エンコーダー
HTML特殊文字をエンティティにエンコード、またはエンティティを元の文字にデコードします。& → &、< → < などの双方向変換。
特殊文字リファレンス
| 文字 | エンティティ | 説明 |
|---|---|---|
| & | & | アンパサンド |
| < | < | 小なり |
| > | > | 大なり |
| " | " | 二重引用符 |
| ' | ' | 一重引用符 |
| | ノーブレークスペース | |
| © | © | 著作権 |
| ® | ® | 登録商標 |
| ™ | ™ | 商標 |
| € | € | ユーロ |
| £ | £ | ポンド |
| ¥ | ¥ | 円/人民元 |
| ° | ° | 度 |
| ± | ± | プラスマイナス |
| × | × | 掛け算 |
| ÷ | ÷ | 割り算 |
ad · 300×250
// about this tool
HTMLエンティティエンコーダーについて
HTMLでは一部の文字が特別な意味を持ちます。< と > はタグを定義し、& はエンティティ参照の開始を示します。これらの文字をテキストとして表示するにはHTMLエンティティ(<、>、&)に変換する必要があります。
HTMLエンティティは & で始まり ; で終わります。名前ベース(&)と番号ベース(&)の2つの形式があり、どちらも同じ文字を表します。適切なエスケープはXSS(クロスサイトスクリプティング)攻撃を防ぐためにも重要です。
このツールはHTML特殊文字をエンティティにエンコード、またはエンティティを元の文字にデコードします。よく使われるエンティティのリファレンス表も含まれており、HTMLテンプレートやメールテンプレートの作成時に役立ちます。
主な使用場面
- ▸XSS防止のためHTMLに挿入する前のユーザー入力エスケープ
- ▸HTMLメールテンプレートでの特殊文字の正確な表示
- ▸Webページ上でHTMLソースコードをそのまま表示
- ▸& < > " を含むmetaタグのtitleやdescription作成
- ▸レガシーシステムのHTMLエンティティデコード
よくある質問
Q. & と & の違いは何ですか?
& は名前ベース、& は数値(コードポイント)ベースのエンティティです。どちらも同じ文字(&)を表し、すべての現代ブラウザで同様に動作します。
Q. すべてのUnicode文字をエンティティに変換する必要がありますか?
UTF-8エンコードのHTML5では、&、<、>、"、'以外のほとんどのUnicode文字はそのまま使用できます。エスケープが必要なのはHTMLパーサーが特別に処理する文字のみです。
Q. JavaScriptで自動的にHTMLエスケープする方法は?
element.textContent を使用すると自動的にエスケープされます。ReactのJSXでも文字列は自動エスケープされます。手動エスケープが必要なのはinnerHTMLやdangerouslySetInnerHTMLを使う場合のみです。