HTMLエスケープ・アンエスケープ

チートシートPDF

テキストを入れて「エスケープ」か「元に戻す」を押してください。ブログやHTMLメールにコードを載せるときに。

入力

結果

🔗 この結果を別のツールで続けて使う

結果を入れた状態で、選んだツールを開きます(データは送信も保存もしません)。

入力したデータは送信も保存もしません。悪用することも一切ありません。くわしく

HTMLエスケープが必要な理由

HTML では < や > はタグの始まりと終わり、& は文字参照の始まりという特別な意味を持っています。 そのため、ブログ記事やマニュアルに <div> のようなコードをそのまま書くと、文字として表示されずにタグとして解釈されてしまいます。 これらを &lt; のような「文字参照」に置き換えるのがHTMLエスケープです。

また、Webアプリでユーザーが入力した文字をエスケープせずに画面に表示すると、クロスサイトスクリプティング(XSS)という脆弱性の原因になります。 実際の開発ではテンプレートエンジンやフレームワークの自動エスケープを使い、このツールは動作確認やデータの調査、記事の作成に使ってください。

エスケープする文字の早見表

文字文字参照数値文字参照意味
&&amp;&#38;アンパサンド
<&lt;&#60;小なり(タグの開始)
>&gt;&#62;大なり(タグの終了)
"&quot;&#34;ダブルクォート(属性値)
'&apos;&#39;シングルクォート(属性値)

よく使う文字参照

表示書き方表示書き方
(空白)&nbsp;©&copy;
®&reg;™&trade;
¥&yen;×&times;
…&hellip;→&rarr;
«&laquo;»&raquo;

URLに入れる文字の変換はURLエンコード、文字のコード(U+3042 など)を調べたいときは文字コード表示が便利です。

よくある質問

どの文字をエスケープすればいいですか?

最低限 & < > " の4つです。属性値をシングルクォート(')で囲む場合は ' も &#39; にします。& を最初に変換しないと、&lt; の & がさらに &amp; になってしまう(二重エスケープ)ので注意してください。このツールは正しい順番で変換します。

「&amp;amp;」のように二重になってしまったデータを直せますか?

「元に戻す」を2回押すと、&amp;amp; → &amp; → & と1段ずつ戻せます。何回エスケープされているかわからないときは、&amp; がなくなるまでくり返してください。

日本語もエスケープしたほうがいいですか?

文字コードが UTF-8 のページなら、日本語はそのままで問題ありません。文字化けしやすい古いシステムやメールに埋め込む場合は、「ASCII 以外も数値文字参照に」で &#x3042; のような形にできます。

変換・計算の結果は正確さに努めていますが、すべての入力での動作を保証するものではありません。 業務で使う場合は、重要なデータは結果を確認してからご利用ください。詳しくは免責事項をご覧ください。