itemprop
å
¨å±å±æ§ **itemprop**被ç¨äºåä¸ä¸ªç©ä½ä¸æ·»å 屿§ãæ¯ä¸ä¸ª HTML å
ç´ é½å¯ä»¥æå®ä¸ä¸ª itemprop 屿§ï¼ä¸ä¸ªitemprop屿§ç± name-value å¯¹ç»æãæ¯ä¸ä¸ªé®å¼å¯¹ç§°ä¸ºä¸ä¸ªå±æ§ï¼ä¸ä¸ªå
ç´ å¯ä»¥æä¸ä¸ªæè
å¤ä¸ªå±æ§ã屿§å¼å¯ä»¥æ¯ä¸ä¸ª string æè
ä¸ä¸ª URLï¼å¹¶ä¸å¯ä»¥å大é¨åå
ç´ è¿è¡ç»åï¼å
æ¬<audio>ï¼ <embed>ï¼ <iframe>ï¼ <img>ï¼ <link>ï¼ <object>ï¼ <source> ï¼ <track>ï¼å <video>ã
æ ·ä¾
ä¸é¢çæ ·ä¾å±ç¤ºäºä¸ç»å¸¦æitemprop屿§çæºä»£ç ï¼åé¢çè¡¨æ ¼å±ç¤ºäºäº§ççç»æåæ°æ®ã
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>
Structured data
| Item | ||
|---|---|---|
| itemprop name | itemprop value | |
| itemprop | name | Avatar |
| itemprop | director | James Cameron |
| itemprop | genre | Science fiction |
| itemprop | trailer | ../movies/avatar-theatrical-trailer.html |
屿§
屿§æ¥æçå¼å¯è½æ¯å符串åæè
æ¯ URLãå½ä¸ä¸ªåç¬¦ä¸²å¼æ¯ä¸ä¸ª URL çæ¶åï¼å®è¢«ç¨ <a> åå®ç屿§å¼ hrefã<img> åå®ç屿§å¼ src æè
å
¶ä»è¢«é¾æ¥å°æåµå
¥å¤é¨çèµæºçå
ç´ æ¥è¡¨è¿°ã
Three properties with values that are strings
<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>
One property, "image", whose value is a URL
<div itemscope>
<img itemprop="image" src="google-logo.png" alt="Google" />
</div>
å½ä¸ä¸ªå符串å¼ä¸è½ä»¤äººéä¿ææçæ¶åï¼e.g.ï¼ä¸ä¸ªé¿ä¸²çæ°åå忝ï¼ï¼å®è½è¢«ç¨ data å ç´ ç value 屿§è¡¨ç¤ºï¼ç¨æç»å ç´ å å®¹çæ´ææççæ¬ï¼å®ä¸æ¯ç»æåæ°æ®çä¸é¨å - 请çä¸é¢çä¾åï¼ã
An item with a property whose value is a product ID
ID 䏿¯äººæ§åçï¼æä»¥äº§åçå忝ç¨ç人æè½çæçæåè䏿¯ IDã
<h1 itemscope>
<data itemprop="product-id" value="9678AOU879">The Instigator 2000</data>
</h1>
å¯¹äºæ°åæ°æ®ï¼meter å ç´ åå®ç value 屿§å¼è½å¤è¢«ç¨æ¥è¡¨è¿°ã
A meter element
<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>
䏿¤ç¸ç±»ä¼¼çï¼å¯¹äºæ¥ææ¶é´ç¸å ³çæ°æ®ï¼time å ç´ åä»ç datetime 屿§å¼è½å¤è¢«ä½¿ç¨è¡¨ç¤ºã
An item with one property, "birthday", whose value is a date
<div itemscope>
I was born on
<time itemprop="birthday" datetime="2009-05-10">May 10th 2009</time>.
</div>
éè¿æå ç´ ä¸ç itemscope 屿§ä¸å£°æå±æ§ï¼å±æ§ä¹å¯ä»¥æ¯ä¸ä¸ªç» name-values å¯¹ãæ¯ä¸ªå¼æ¢å¯ä»¥æ¯ä¸ä¸ªå符串åå¯ä»¥æ¯ä¸ç» name-values 对ï¼i.e. ä¸ä¸ªé¡¹ï¼ã
An outer item representing a person, and an inner one representing a band
<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>
ä¸é¢çå¤å±é¡¹æä¸¤ä¸ªå±æ§ï¼ânameâåâbandâãânameâç弿¯âAmandaâ, âbandâç弿¯ä¸ä¸ªå¨å®å³ä¾§ç项å³å®çï¼å®æä¸¤ä¸ªå±æ§ï¼ânameâåâsizeâãä¹éçânameâç弿¯âJazz Bandâï¼âsizeâç弿¯â12âãè¿ä¸ªä¾åçå¤å±é¡¹æ¯é¡¶çº§å¾®æ°æ®æ ç¾ã䏿¯å ¶ä»é¡¹çé¡¹è¢«ç§°ä¸ºé¡¶çº§å¾®æ°æ®é¡¹ã
All the properties separated from their items
è¿ä¸ªæ ·ä¾åä¹åä¸ä¸ªä¸æ¸ä¸æ ·ï¼ä½æ¯ææç屿§é½è¢«ä»å®ä»¬ç项ä¸å离äºåºæ¥ã
<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>
è¿äº§çäºåä¹åæ ·ä¾ç¸åçç»æã第ä¸ä¸ªé¡¹æä¸¤ä¸ªå±æ§ï¼ânameâï¼è®¾ç½®ä¸ºâAmandaâåâbandâï¼è®¾ç½®å°å¦ä¸ä¸ªé¡¹å»äºã第äºä¸ªé¡¹æä¸¤ä¸ªæ´è¿ä¸æ¥ç屿§ï¼ânameâ设置为âJazz Bandâå¹¶ä¸âsizeâ设置为â12âã
ä¸ä¸ªé¡¹å¯ä»¥æå¤ä¸ªæ¥æç¸ååå使¯å¼ä¸åç屿§ã
Ice cream with two flavors
<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>
è¿äº§çäºä¸ä¸ªç©ä½æä¸¤ä¸ªå±æ§ï¼é½æ¥æåå "flavor" 使¯å´æä¸åçå¼ "Lemon sorbet" å "Apricot sorbet"ã
为äºå½ä¸äºå±æ§æç¸åå¼çæ¶åé¿å éå¤ï¼ä¸ä¸ªä»ç»ä¸ä¸ªå±æ§çå ç´ åæ ·å¯ä»¥ä¸æ¬¡æ§ä»ç»å¤ä¸ªå±æ§ã
An item with two properties, "favorite-color" and "favorite-fruit", both set to the value "orange"
<div itemscope>
<span
itemprop="favorite-color
favorite-fruit"
>orange</span
>
</div>
夿³¨ï¼å¾®æ°æ®å被æ è®°å¾®æ°æ®çææ¡£çå 容ä¹é´æ¯æ²¡æå ³ç³»çã
Same structured data marked up in two different ways
è¯ä¹ä¸ä¸é¢çä¸¤ä¸ªæ ·ä¾æ²¡æä»»ä½åºå«ã
<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>
两è 齿¯æ¥ææ é¢çå¾ï¼å¹¶ä¸é½åæ¶ï¼åå¾å®å ¨æ å ³å°ï¼æä¸ä¸ª å忝 "name" å¹¶ä¸å¼æ¯"The Castle"çé®å¼å¯¹çç©ä½é¡¹ãå¯ä¸çåºå«æ¯å¦æç¨æ·æå¾çæ 颿æ½åºææ¡£çè¯ï¼è¿ä¸ªé¡¹ä¼å å«å¨ææ½çæ°æ®ä¸ãå¾åç¸å ³ç项ä¸ä¼è¢«å æ¬ã
åååå¼
ä¸ä¸ªå±æ§æ¯ä¸ä¸ªå¤§å°åææä¸å±ç¤ºé®å¼å¯¹çå å«å¯ä¸åºåçæ åºéåã屿§çå¼å¿ é¡»æè³å°ä¸ä¸ªåºåãä¸é¢çè¿ä¸ªæ ·ä¾ä¸ï¼æ¯ä¸ªæ°æ®æ ¼å齿¯ä¸ä¸ªåºåã
Names examples
| 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) |
åºåæ¢å¯ä»¥æ¯å符串ä¹å¯ä»¥æ¯ URLã妿æ¯ä¸ä¸ª URLï¼é£ä¹è¿ä¸ªé¡¹è¢«ç§°ä¸ºç±»å项ãå¦å宿¯ä¸ä¸ªå符串ãå符串ä¸è½å æ¬å¥å·ååå·ï¼å¦ä¸ï¼ã
-
妿项æ¯ä¸ä¸ªç±»å项å®å¿ 须满足ï¼
- æ¯ä¸ä¸ªè¢«å®ä¹ç屿§å
- ä¸ä¸ªåæ³çæåè¯æ³å®ä¹ç URL
- ä¸ä¸ªåæ³çè¢«ç¨æ¥å½ä½æææé¡¹å±æ§åç URL
-
妿ä¸ä¸ªé¡¹ä¸æ¯ç±»å项ï¼ä»å¿ é¡»ï¼
- ä¸ä¸ªä¸å« "." (U+002E å¥å·) å ":" (U+003A åå·) å¹¶ä¸è¢«ç¨ä½ä¸ä¸ªæææé¡¹ç屿§åï¼æ²¡æå ¬å ±è§èå®ä¹çï¼
注æï¼ ä¸é¢çè§åä¸å 许 ":" 卿²¡æ URL çå¼ä¸ æ¯å 为å¦åå®ä»¬æ²¡æ³å URL ä½åºåã带æ"." çå¼è¢«ä¿çä½ä¸ºå°æ¥å¯è½çæå±ãç©ºæ ¼ä¹ä¸è¢«å 许æ¯å 为å¦åå¼å°±ä¼è¢«è§£æä¸ºå¤ä¸ªåºåã
å¼
The property value of a name-value pair is as given for the first matching case in the following list:
-
If the element has an itemscope attribute
- The value is the item created by the element.
-
If the element is a meta element
- The value is the value of the element's content attribute
-
If the element is an audio, embed, iframe, img, source, track, or video element
- The value is the resulting URL string that results from parsing the value of the element's src attribute relative to the node document (part of the Microdata DOM API) of the element at the time the attribute is set
-
If the element is an a, area, or link element
- The value is the resulting URL string that results from parsing the value of the element's href attribute relative to the node document of the element at the time the attribute is set
-
If the element is an object element
- The value is the resulting URL string that results from parsing the value of the element's data attribute relative to the node document of the element at the time the attribute is set
-
If the element is a data element
- The value is the value of the element's value attribute
-
If the element is a meter element
- The value is the value of the element's value attribute
-
If the element is a time element
- The value is the element's datetime value
Otherwise
- The value is the element's textContent.
If a property's value is a URL, the property must be specified using a URL property element. The URL property elements are the a, area, audio, embed, iframe, img, link, object, source, track, and video elements.
Name order
Names are unordered relative to each other, but if a particular name has multiple values, they do have a relative order.
In the following example, the "a" property has the values "1" and "2", in that order, but whether the "a" property comes before the "b" property or not is not important
<div itemscope>
<p itemprop="a">1</p>
<p itemprop="a">2</p>
<p itemprop="b">test</p>
</div>
The following is equivalent
<div itemscope>
<p itemprop="b">test</p>
<p itemprop="a">1</p>
<p itemprop="a">2</p>
</div>
As is the following
<div itemscope>
<p itemprop="a">1</p>
<p itemprop="b">test</p>
<p itemprop="a">2</p>
</div>
And the following
<div id="x">
<p itemprop="a">1</p>
</div>
<div itemscope itemref="x">
<p itemprop="b">test</p>
<p itemprop="a">2</p>
</div>
å ¶ä»æ ·ä¾
>HTML
<dl
itemscope
itemtype="http://vocab.example.net/book"
itemid="urn:isbn:0-330-34032-8">
<dt>Title</dt>
<dd itemprop="title">The Reality Dysfunction</dd>
<dt>Author</dt>
<dd itemprop="author">Peter F. Hamilton</dd>
<dt>Publication date</dt>
<dd><time itemprop="pubdate" datetime="1996-01-26">26 January 1996</time></dd>
</dl>
Structured data
| 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 | |
Result
è§è
| è§è |
|---|
| HTML > # names:-the-itemprop-attribute > |