HTML エンティティのエンコード・デコード
テキストを名前付き・10進・16進のエンティティで HTML 用にエスケープしたり、& や é などのエンティティを文字に戻したりします。
コード例
自分のプロジェクトにコピーして使えます。どの例も言語の標準ライブラリだけを使うので、インストールするものはありません。
const text = '<p class="x">Tom & Jerry</p>'
const entities = { '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' }
console.log(text.replace(/[&<>"']/g, (char) => entities[char]))できること
テキストを HTML 用にエスケープし、HTML エンティティを文字に戻します。エンティティは文字を名前（é）、10進数（é）、16進数（é）で書き表します。
使い方
- テキストを入力または貼り付けるか、テキストファイルをドロップします。
- エンコードかデコードを選びます。エンコードでは、HTML がマークアップとして読む文字だけをエスケープするか非 ASCII 文字もエスケープするか、名前・10進・16進のどれで書くかを選びます。
- 結果をコピーまたはダウンロードします。
例
マークアップのエスケープ：
<p class="x">Tom & Jerry</p> は <p class="x">Tom & Jerry</p> になります。非 ASCII 文字もすべてエスケープすると、café © € は café © € になります。
知っておくと便利なこと
- HTML のテキストと属性で常にエスケープが必要な文字は
&、<、>、"、'です。 - アポストロフィは HTML 4 に名前がないため
'と書きます。デコードは'も読みます。 - 絵文字のように名前のない文字は、1文字につき1つの数値で書かれます。
- 名前の表は HTML 4.01 の252個のエンティティを含みます。表にない名前は、デコード時に入力のまま残ります。
HTML エンティティとは？
エンティティは、文字を入力せずに HTML に書く方法です。é のような名前、または é（10進）や é（16進）のような数値で書きます。HTML がマークアップとして読むため、テキストと属性では5つの文字（& < > と2種類の引用符）をエスケープする必要があります。
よくある質問
どの文字をエスケープすべきですか？
テキストでは & と <、属性値の中ではその値を囲む引用符をエスケープします。> と両方の引用符をどこでもエスケープしても無害で、それが安全な既定値であり、「マークアップのみ」が行うことです。ユーザー入力をこのようにエスケープすることは、注入されたマークアップへの第一の防御です。
アポストロフィが名前でなく ' になるのはなぜですか？
HTML 4 にはアポストロフィの名前付きエンティティがありません。' は XML と HTML5 にありますが古いソフトウェアは知らないため、数値が安全な選択です。デコードはどちらも受け付けます。
このツールはテキストをどこかに送信しますか？
いいえ。すべてブラウザ内で行われます。入力した内容が当社のサーバーに送信されることはありません。