JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

HTML5の文字エンティティとは？予約文字の実体参照一覧と使い方

HTML5の文字エンティティ（実体参照）とは

HTML5では、一部の文字が「予約文字」として扱われます。たとえば、半角の不等号「<」（小なり）や「>」（大なり）をテキスト中にそのまま記述すると、ブラウザがこれらをタグ（マークアップ）の一部と誤認識してしまい、意図したとおりに表示されません。

こうした特殊な文字を安全に表示するために用いられるのが「文字エンティティ（実体参照）」です。HTML5の仕様では、処理系（ブラウザなど）は次の表に示す5つの特殊文字に対応するエンティティを必ずサポートしなければならないと定められています。

HTML5でサポート必須の5つの特殊文字一覧

記号説明エンティティ名数値コード
"二重引用符&quot;&#34;
'アポストロフィ（一重引用符）&apos;&#39;
&アンパサンド&amp;&#38;
<小なり記号&lt;&#60;
>大なり記号&gt;&#62;

エンティティの使い方のポイント

エンティティは「エンティティ名」と「数値コード」のどちらの形式でも記述でき、両者はまったく同じ文字として解釈されます。たとえば、ページ上にコード例「<p>サンプル</p>」を見せたい場合は、&lt;p&gt;サンプル&lt;/p&gt;のように記述します。

なお、上記の5文字以外にも著作権記号（&copy;）や改行なし空白（&nbsp;）など多数のエンティティが存在しますが、環境によって表示結果が異なる場合があります。基本的な予約文字は必ずエンティティへ置き換えることで、意図どおりの表示を保ち、マークアップの破損を防ぐことができます。

  1. JavaScriptのPromiseとは？非同期処理の基本をわかりやすく解説

    JavaScriptのPromiseとは？Promise（プロミス）は、JavaScriptで非同期処理を扱うためのオブジェクトです。Promiseが生成された時点では、最終的な結果の値はまだ確定していません。処理が完了した将来のタイミングで、成功または失敗の結果を受け取ることができます。これにより、APIからのデータ取得やファイル読み込みなど、時間のかかる処理を効率的に記述できます。Promiseの3つの状態Promiseは、必ず以下の3つの状態のいずれかを持ちます。pending（待機）：初期状態。処理がまだ完了していない状態です。fulfilled（履行）：処理が正常に完了し、結果の値が

  2. HTML5のCanvasで使える無料ライブラリとは？おすすめ3選をわかりやすく解説

    Webサイトにインタラクティブな要素を追加したいなら、Canvas用の無料ライブラリを活用することで開発作業を大幅に効率化できます。まずは、HTML5でキャンバスを作成する基本方法から見ていきましょう。HTML5のcanvasタグの基本HTMLの<canvas>タグは、JavaScriptなどのスクリプトを使ってグラフィックやアニメーションを描画するために使用される要素です。このタグはHTML5で新たに導入されました。以下のコードを実行すると、HTML5でキャンバスを作成できます。サンプルコード<!DOCTYPE html> <html>   &n