--- title: itemprop slug: Web/HTML/Global_attributes/itemprop tags: - Attribute - Global attribute - HTML - Reference translation_of: Web/HTML/Global_attributes/itemprop ---
{{HTMLSidebar("Global_attributes")}}

L'atribut global itemprop s'utilitza per afegir propietats a un element. Cada element HTML pot tenir un atribut itemprop especificat, i un itemprop es compon d'un parell nom-valor. Cada parell nom-valor es denomina propietat, i un grup d'una o més propietats constitueix un element. Els valors de propietat són una cadena o una adreça URL i es poden associar amb una gamma molt àmplia d'elements incloent {{HTMLElement("audio")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("link")}}, {{HTMLElement("object")}}, {{HTMLElement("source")}} , {{HTMLElement("track")}}, and {{HTMLElement("video")}}.

Exemples

HTML

<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>

Estructuració de les dades

  Item
itemprop name itemprop value
itemprop name Avatar
itemprop director James Cameron
itemprop genre Science fiction
itemprop trailer ../movies/avatar-theatrical-trailer.html

Propietats

Les propietats tenen valors que són una cadena o un URL. Quan un valor de cadena és una adreça URL, s'expressa mitjançant l'element i el seu atribut href, l'element img i el seu atribut src, o altres elements que tenen enllaços o que incoproran recursos externs.

Tres propietats amb valors que són cadenes

<div itemscope>
 <p>My name is <span itemprop="name">Neil</span>.</p>
 <p>My band is called <span itemprop="band">Four Parts Water</span>.</p>
 <p>I am <span itemprop="nationality">British</span>.</p>
</div>

Una propietat, "image", el valor del qual és una adreça URL

<div itemscope>
 <img itemprop="image" src="google-logo.png" alt="Google">
</div>

Quan un valor de cadena no pot ser fàcilment llegit i comprès per una persona (per exemple, una cadena llarga de números i lletres), aquest es pot visualitzar utilitzant l'atribut value de l'element data, aquesta versió és més fàcil d'entendre per un humà ja que determina el contingut dels elements (que no forma part de les dades estructurades - vegeu l'exemple següent).

Un element amb una propietat el valor de la qual és un ID de producte. L'ID no és humanament amistós, pel que el nom del producte s'utilitza el text per a ser humanament visible en lloc del ID.

<h1 itemscope>
 <data itemprop="product-id" value="9678AOU879">The Instigator 2000</data>
</h1>

Per les dades numèriques, l'element meter i el seu atribut value es poden utilitzar.

Un exemple de l'element meter

<div itemscope itemtype="http://schema.org/Product">
 <span itemprop="name">Panasonic White 60L Refrigerator</span>
 <img src="panasonic-fridge-60l-white.jpg" alt="">
  <div itemprop="aggregateRating"
       itemscope itemtype="http://schema.org/AggregateRating">
   <meter itemprop="ratingValue" min=0 value=3.5 max=5>Rated 3.5/5</meter>
   (based on <span itemprop="reviewCount">11</span> customer reviews)
  </div>
</div>

De la mateixa manera, per les dades relacionades amb la data i hora , l'element time i el seu atribut datetime es poden utilitzar.

En aquest exemple, l'element té una propietat, "birthday", el valor de la qual és una date.

<div itemscope>
 I was born on <time itemprop="birthday" datetime="2009-05-10">May 10th 2009</time>.
</div>

Les propietats també poden ser grups de parells nom-valor, posant l'atribut itemscope en l'element que es declara la propietat. Cada valor és una cadena o un grup de parells nom-valor (és a dir, un element).

En aquest exemple, l'element exterior representa una persona, i la interior representa una banda

<div itemscope>
 <p>Name: <span itemprop="name">Amanda</span></p>
 <p>Band: <span itemprop="band" itemscope> <span itemprop="name">Jazz Band</span> (<span itemprop="size">12</span> players)</span></p>
</div>

L'element exterior superior té dues propietats, "name" i "band". El "name" és "Amanda", i la "band" és un element en si mateix, amb dues propietats, "name" i "size". El "name" de la banda és "Jazz Band", i la "size" és "12". L'element exterior en aquest exemple és un element microdata de nivell superior. Els elements que no formen part dels altres s'anomenen elements microdata de nivell superior.

Aquest exemple és el mateix que l'anterior, però totes les propietats són separades dels seus elements

<div itemscope id="amanda" itemref="a b"></div>
<p id="a">Name: <span itemprop="name">Amanda</span></p>
<div id="b" itemprop="band" itemscope itemref="c"></div>
<div id="c">
 <p>Band: <span itemprop="name">Jazz Band</span></p>
 <p>Size: <span itemprop="size">12</span> players</p>
</div>

Això dóna el mateix resultat que l'exemple anterior. El primer element té dues propietats, "name", té asignat "Amanda" i "band", té  asignat un altre element. Aquest segon element té dues propietats addicionals, "name" té assignat "Jazz Band", i "size ", té assignat "12".

Un element pot tenir diverses propietats amb el mateix nom i diferents valors.

Aquest exemple descriu un gelat, amb dos sabors

<div itemscope>
 <p>Flavors in my favorite ice cream:</p>
 <ul>
  <li itemprop="flavor">Lemon sorbet</li>
  <li itemprop="flavor">Apricot sorbet</li>
 </ul>
</div>

Això dóna com a resultat un element amb dues propietats, ambdues amb el nom "flavor" i amb els valors "Lemon sorbet" i "Apricot sorbet" .

Un element que introdueix una propietat també pot introduir múltiples propietats a la vegada, per evitar la duplicació quan algunes de les propietats tenen el mateix valor.

Aquí veiem un element amb dues propietats, "favorite-color" i "favorite-fruit", ambdues establertes en el valor "orange"

<div itemscope>
 <span itemprop="favorite-color favorite-fruit">orange</span>
</div>

Nota: No hi ha relació entre els microdata i el contingut del document, on els microdata son marcats.

No hi ha cap diferència semàntica entre els dos exemples següents

<figure>
 <img src="castle.jpeg">
 <figcaption><span itemscope><span itemprop="name">The Castle</span></span> (1986)</figcaption>
</figure>
<span itemscope><meta itemprop="name" content="The Castle"></span>
<figure>
 <img src="castle.jpeg">
 <figcaption>The Castle (1986)</figcaption>
</figure>

Tots dos tenen una figura amb un títol, i tots dos, sense cap relació amb la figura, té un element amb un parell nom-valor amb el nom "name" i el valor "The Castle". L'única diferència és que si l'usuari arrossega el figcaption fora del document, l'element serà inclos en les dades d'arrossegar i deixar anar. No s'inclourà la imatge associada amb l'element.

Noms i valors

Una propietat és un conjunt desordenat de símbols únics que són sensibles i representen els parells de nom-valor. El valor de la propietat ha de tenir almenys un símbol. En el següent exemple, cada cel·la de dades és un símbol.

Exemples Noms

  Item
itemprop name itemprop value
itemprop country Ireland
itemprop Option 2
itemprop https://www.flickr.com/photos/nlireland/6992065114/ Ring of Kerry
itemprop img https://www.flickr.com/photos/nlireland/6992065114/
itemprop website flickr
itemprop (token) (token)

Els tokens són cadenes o URL's. Un element es denomina un element escrit ( typed item ) si és un URL. Altrament, és una cadena. Les cadenes no poden contenir un punt o dos punts (vegeu més endavant).

  1. Si l'element és un element escrit aquest ha de ser:
    1. Un nom de propietat definida, o
    2. Una URL vàlida, que es refereix a la definició del vocabulari, o
    3. Una URL vàlida que s'usa com un nom de propietari propietat de l'element (és a dir, no està definit en una especificació pública), o
  2. Si l'element no és un element escrit aquest ha de ser:
    1. Una cadena que no conté caràcters "." (U+002E FULL STOP)  i sense caràcters ":" (U+003A COLON) i s'usa com un nom de propietat d'element propietari (de nou, no s'ha definit en una especificació pública).

Nota: les regles anteriors no permeten caràcters ":" en valors no URL, perquè en cas contrari no podien distingir-se de les URLs. Els valors amb caràcters "." estan reservats per a futures ampliacions. Els caràcters d'espai no es permeten perquè en cas contrari els valors serien analitzats com múltiples símbols.

Valors

El valor de la propietat d'un parell nom-valor es dóna per al primer cas coincident de la llista següent:

D'una altra manera

Si el valor d'una propietat és un URL, la propietat s'haurà d'especificar mitjançant un element de propietat URL. Els elements de la propietat URL són els elements a, area, audio, embed, iframe, img, link, object, source, track i video.

Ordre dels noms

Els noms estan desordenats respecte a l'altra, però si un nom en particular té diversos valors, tenen un ordre relatiu.

En el següent exemple, la propietat "a" té els valors "1" i "2", en aquest ordre, però si la propietat "a" ve abans que la propietat "b" o no, no és important

<div itemscope>
 <p itemprop="a">1</p>
 <p itemprop="a">2</p>
 <p itemprop="b">test</p>
</div>

El següent és equivalent

<div itemscope>
 <p itemprop="b">test</p>
 <p itemprop="a">1</p>
 <p itemprop="a">2</p>
</div>

Com és el següent

<div itemscope>
 <p itemprop="a">1</p>
 <p itemprop="b">test</p>
 <p itemprop="a">2</p>
</div>

  I el següent

<div id="x">
 <p itemprop="a">1</p>
</div>
<div itemscope itemref="x">
 <p itemprop="b">test</p>
 <p itemprop="a">2</p>
</div>

Altres exemples

HTML

<dl itemscope itemtype="http://vocab.example.net/book" itemid="urn:isbn:0-330-34032-8">
 <dt>Title <dd itemprop="title">The Reality Dysfunction
 <dt>Author <dd itemprop="author">Peter F. Hamilton
 <dt>Publication date
 <dd><time itemprop="pubdate" datetime="1996-01-26">26 January 1996</time>
</dl>

Estructuració de les dades

itemscope itemtype: itemid http://vocab.example.net/book: urn:isbn:0-330-34032-8
itemprop title The Reality Dysfunction
itemprop author Peter F. Hamilton
itemprop pubdate 1996-01-26

Resultat

{{EmbedLiveSample('HTML_2', '', '', '', 'Web/HTML/Global_attributes/itemprop')}}

Especificacions

Especificació Estat Comentari
itemprop   WG Nota - Ja no s'està desenvolupant activament

{{CompatibilityTable}}

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suport bàsic {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport bàsic {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}

Veure