References

Beginner-friendly references for web development, with live, editable examples.

The HTML itemref attribute

Global attribute Works on every element All modern browsers Updated
Quick answer

The HTML itemref attribute lets a microdata item pull in properties from elements elsewhere in the document by referencing their id values. It is set on the element that has itemscope.

Overview

Normally a microdata item's properties must live inside the element that has itemscope. The itemref attribute relaxes that: it lists the id values of other elements whose itemprop properties should be added to the item.

This is useful when the markup you want to annotate is scattered across the page and you cannot wrap it all in one container. List the ids separated by spaces.

Syntax

<div itemscope itemtype="https://schema.org/Person" itemref="job">
  <span itemprop="name">Ada Lovelace</span>
</div>
<p id="job"><span itemprop="jobTitle">Mathematician</span></p>

Values

Value
A space-separated list of element id values.

Example

Live example 
<div itemscope itemtype="https://schema.org/Person" itemref="role">
  <span itemprop="name">Ada Lovelace</span>
</div>
<p id="role"><span itemprop="jobTitle">Mathematician</span></p>

Best practices

  • Use a consistent vocabulary (such as schema.org) via itemtype.
  • Start an item with itemscope and describe its fields with itemprop.
  • Consider JSON-LD as an alternative — many teams find it easier to maintain than inline microdata.
  • Validate your structured data with a testing tool.

Frequently asked questions

What does the itemref attribute do?
Specifies the list of element id's with additional properties.
What is HTML microdata?
A way to mark up structured data inline using itemscope, itemprop and related attributes so machines can read it.
Should I use microdata or JSON-LD?
Both work. JSON-LD keeps structured data in one script block and is often easier to maintain; microdata annotates the visible markup directly.
Is itemref a global attribute?
Yes — it is a global attribute, so it can be set on any HTML element (it is a global attribute).
itemprop itemscope