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

HTMLのdel要素におけるcite属性の使い方を解説

HTML del要素のcite属性とは

<del>要素のcite属性は、特定のテキストが削除された理由を説明するHTMLドキュメントへのURLを指定するための属性です。この属性を設定することで、なぜそのテキストが削除されたのかを示す参照元を明示できます。

cite属性の基本構文

cite属性の書き方は以下のとおりです。

<del cite="url">

ここで指定する「url」には、テキストが削除された理由が記載されているドキュメントのアドレス(リンク先)を記述します。

cite属性の実装例

それでは、<del>要素のcite属性を使った具体的なサンプルコードを見てみましょう。

サンプルコード

<!DOCTYPE html>
<html>
<body>
<h2>学習科目一覧</h2>
<dl>
    <dt>JavaScript</dt>
    <dd>スクリプト言語です。</dd>
    <dt>Java</dt>
    <dd>プログラミング言語です。</dd>
    <dt>jQuery</dt>
    <dd>JavaScriptのライブラリです。</dd>
    <dt>C#</dt>
    <dd>オブジェクト指向プログラミング言語です。</dd>
</dl>
<p><del cite="exams_cancelled.htm">5月3日からの内部試験</del></p>
</body>
</html>

表示結果

上記のコードを実行すると、定義リストで表示された学習科目の一覧に加えて、削除線が引かれたテキスト「5月3日からの内部試験」が表示されます。

コードの解説

この例では、<del>要素を使ってテキストを削除済みとしてマークしています。

<del cite="exams_cancelled.htm">
    5月3日からの内部試験
</del>

さらに、cite属性を使って削除の理由を示すドキュメントへの参照を設定しています。

cite="exams_cancelled.htm"

このように、cite属性にURLを指定することで、「試験が中止になったこと」など削除の背景にある情報源を明示できます。ブラウザ上では通常、<del>要素内のテキストに打ち消し線が表示され、ユーザーに対して視覚的に削除を伝えることができます。

まとめ

  • cite属性は、削除された理由を説明するドキュメントのURLを指定する属性である
  • 値には有効なURLを記述する
  • 削除の意図や経緯を文書として残したい場合に活用できる

Webページの編集履歴や更新履歴を明確にしたい場合に、cite属性は非常に便利な機能です。ぜひ活用してみてください。

  1. HTMLのrequired属性とは？使い方とサンプルコードをわかりやすく解説

    HTMLのrequired属性は、フォームを送信する前に該当要素の入力または選択が必須であることを指定するためのブール型属性です。この属性は、input、select、textarea の各要素に適用できます。required属性が設定されたフィールドが空のままフォームを送信しようとすると、ブラウザが自動的にバリデーションを行い、「このフィールドは必須です」といったエラーメッセージを表示して送信を阻止します。JavaScriptを使わずに簡単な入力チェックを実現できるため、フォーム作成時には非常に便利な属性です。構文（シンタックス）required属性の基本的な構文は以下の通りです。<t

  2. HTML pattern属性とは？使い方とサンプルコードをわかりやすく解説

    HTMLのpattern属性は、<input>要素に入力された値が、あらかじめ指定した正規表現に一致するかどうかを検証するための属性です。この属性を活用すれば、JavaScriptを書かなくてもブラウザ側で手軽に入力チェック（バリデーション）を実装でき、フォームの利便性を高めることができます。pattern属性を指定した入力欄に正規表現と一致しない値が入力された場合、フォーム送信時にエラーメッセージが表示され、送信がブロックされます。利用できるのはtext・search・tel・url・email・passwordなどのテキスト系入力タイプです。構文pattern属性の基本構文は次