Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】itemref属性の使い方

itemref属性の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

itemrefプロパティは、Microdata(マイクロデータ)の文脈において、itemscope属性で定義されたアイテムに、そのアイテムのプロパティとなる情報を、HTMLドキュメント内の別の場所に存在する要素から参照させるためのIDリストを保持するプロパティです。これは、HTML Living Standardで定義されるグローバル属性の一つとして提供されています。

通常、Microdataを使用してWebページ内の情報を構造化する場合、itemscope属性を持つ要素の子孫要素として、そのアイテムのプロパティを直接記述します。しかし、itemref属性を用いることで、物理的に離れた場所にある要素を、あたかもそのアイテムのプロパティであるかのように関連付けることが可能になります。

具体的には、itemref属性の値として、参照したい要素のid属性値をスペース区切りで複数指定します。これにより、Webページのレイアウト上の制約から、関連する情報がドキュメントの異なるセクションに配置されている場合でも、それらを論理的に一つのまとまり(アイテム)として定義し、検索エンジンやその他の機械可読なシステムがWebページのコンテンツをより正確に理解できるようになります。この属性は、既存のHTML構造に大きな変更を加えることなく、セマンティックな情報を追加する柔軟な手段を提供します。

公式リファレンス: HTML itemref global attribute

構文(syntax)

1<div itemscope itemtype="http://schema.org/Person" itemref="contact-info">
2  <span itemprop="name">John Doe</span>
3</div>
4
5<p id="contact-info">
6  Email: <span itemprop="email">john.doe@example.com</span>
7</p>

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ