DevToolPal
日本語

HTML エンティティ エンコード・デコード

テキストを < や é のような HTML エンティティにエスケープ、またはエンティティをプレーンテキストにデコードします。

ローカルで処理、アップロードなし

オプション

モード

入力

0 文字 · 0 B

出力

0 文字 · 0 B

機能

HTML エンティティは、< を表す &lt; や é を表す &eacute; のように、文字を表すコードです。このツールはテキストをエンティティにエスケープして Web ページ内に安全に表示できるようにし、また CMS やメールテンプレートからマークアップをコピーしたときなどに、エンティティをプレーンテキストにデコードします。

エンコードには 2,000 以上の名前付き参照を含む HTML5 の完全なリストを使い、デコードでは名前付き、10 進数(&#169;)、16 進数(&#xA9;)の参照をブラウザとまったく同じように解釈します。

使い方

  1. 入力 欄にテキストや HTML を貼り付けるか、ファイルをアップロードするか、サンプル をクリックします。
  2. エンコード または デコード を選びます。
  3. エンコードする場合は、どこまでエンコードするかを選びます:
    • & < > ” ’ のみ:テキストを HTML や属性に入れるのに必要な最小限です。
    • 非 ASCII も(名前付き):é、©、— などの文字も名前付きエンティティにし、名前のない文字は数値参照にします。
    • 非 ASCII も(数値):同様ですが常に数値参照(&#xe9;)を使います。こちらは XML としても有効です。
    • 名前のある文字すべて:. や / などの句読点までエンコードします。システムがそれらの文字を取り除いてしまう場合に便利です。
  4. 結果をコピーするか、ダウンロードします。入力に使う で再びデコードして、往復変換を確認できます。

例

<p>Café & "crème brûlée"</p>

を特殊文字のみでエンコードすると次のようになります

&lt;p&gt;Café &amp; &quot;crème brûlée&quot;&lt;/p&gt;

非 ASCII を名前付きエンティティにすると次のようになります

&lt;p&gt;Caf&eacute; &amp; &quot;cr&egrave;me br&ucirc;l&eacute;e&quot;&lt;/p&gt;

よくある使い道

ブラウザに描画させずにブログでコードスニペットを表示する、ユーザーのテキストを HTML メールに入れる、&amp;amp; のような二重にエスケープされたテキストを修正する(1 回デコードします)、ASCII しか受け付けないシステム向けにファイルを安全にする、といった用途に使えます。

よくある質問

› HTML でエスケープが必要な文字はどれですか?

テキスト中では & と < をエスケープします。属性値の中では、値を囲んでいる引用符もエスケープします。ここでの既定のように & < > " ' を常にエスケープしておけば、どこでも安全です。

› 名前付きエンティティと数値参照のどちらを使うべきですか?

どちらもモダンブラウザなら動作します。&eacute; のような名前付きエンティティは読みやすく、&#xe9; のような数値参照は XML や、少数の名前しか知らない古いパーサーでも使えます。UTF-8 のページなら、通常は非 ASCII 文字をエンコードする必要はまったくありません。

› セミコロンのないエンティティもデコードできますか?

はい。HTML 仕様に従っているため、セミコロンのない &copy のような古い形式もブラウザと同じようにデコードします。&foo; のような未知の名前はそのまま残します。

› エスケープだけで XSS を防げますか?

HTML 要素内やクォートされた属性内に置くテキストに対しては、エスケープが正しい防御策です。ただし script ブロック、style ブロック、イベントハンドラー属性、URL の中では、エスケープしても信頼できない入力は安全になりません。それぞれの文脈に応じたエンコードが必要です。