itemref属性 - 関連付けるアイテム
公開日:
itemref属性は、この要素を、離れた場所にあるアイテム要素に関連付けるための属性です。アイテム要素のid属性を指定します。構造化データをマークアップするのに利用します。
説明
itemref属性は、構造化データをマークアップする上で、何らかの事情で離れた場所にある要素と要素を関連付けるための属性です。離れた場所にある要素のidを指定します。
HTML
<!-- 構造化データをマークアップした要素 -->
<dl itemscope
itemtype="http://schema.org/Book"
itemref="syncer">
<dt>書籍名</dt>
<dd itemprop="name">SYNCER</dd>
</dl>
<!-- 離れた場所にある要素 -->
<dl id="syncer">
<dt>ISBN</dt>
<dd itemprop="isbn">123-4-5678-AAAA-B</dd>
</dl>
サンプルコード
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>【デモ】itemref属性 - 関連付けるアイテム</title>
<link rel="canonical" href="https://syncer.jp/Web/HTML/Reference/Global_attribute/itemref/">
<style>
body {
background-color: #fff ;
}
</style>
</head>
<body>
<p>itemref属性は、構造化データをマークアップする上で、離れた場所にある要素と関連付けるための属性です。</p>
<p>どのような構造化データになるのか確認してみて下さい。 (<a href="https://search.google.com/structured-data/testing-tool/u/0/?hl=ja#url=https%3A%2F%2Fdemo.syncer.jp%2F825%2F" target="_blank">Google構造化データテストツール</a>)</p>
<h2>構造化データをマークアップした要素</h2>
<dl
itemscope
itemtype="http://schema.org/Book"
itemref="syncer">
<dt>書籍名</dt>
<dd itemprop="name">SYNCER</dd>
</dl>
<h2>離れた場所にある要素</h2>
<dl id="syncer">
<dt>ISBN</dt>
<dd itemprop="isbn">123-4-5678-AAAA-B</dd>
</dl>
</body>
</html>