一、什么是微數(shù)據(jù)

一個頁面的內容律杠，不僅要給用戶看，還要讓機器可識別炎滞。而目前機器智能程度有限湃望，要讓其知會特定內容含義官硝，我們需要使用規(guī)定的標簽害淤、屬性名以及特定用法等移国。如使用 <h1> 標簽包裹頁面標題信息就是為了讓機器識別（搜索引擎 SEO）

微數(shù)據(jù)本質是給網頁中可見的數(shù)據(jù)提供附加語義的標準化方式。允許我們在網頁元素中嵌入自定義屬性摩梧。是為了方便機器識別而產生的東西。適合于精細地優(yōu)化那些已經在 DOM 中的數(shù)據(jù)的語義性寞酿。

如在 span、div 標簽內添加屬性拉馋，讓機器識別其特定類型的信息，例如評論、人物信息或事件都有相應的屬性，用來描述其意義谱净。

HTML5 微數(shù)據(jù)規(guī)范是一種標記內容以描述特定類型的信息，每種信息都有描述特定類型的項绅络。

二茸歧、微數(shù)據(jù)中的概念

微數(shù)據(jù)使用來自自定義的詞匯表的、帶作用域的名/值對來給 DOM 做標記

2.1 作用域

微數(shù)據(jù)重用了 DOM 本身的層級結構铜涉，提供了一種方式來表達“所有該元素的屬性都來自這個詞匯表”智玻。允許在同一個頁面使用多個微數(shù)據(jù)詞匯表，甚至可以將詞匯表嵌套芙代，完全和 DOM 結構用法一樣吊奢。

作用域，就是指定元素為微數(shù)據(jù)的項目纹烹，各個項可以嵌套页滚，類似于 DOM 結構，是一個命名空間

2.2 詞匯表

指向一個網址 URL铺呵，并不一定實際存在（實際存在最好）裹驰，定義微數(shù)據(jù)使用的詞匯的命名空間。

微數(shù)據(jù)詞匯表有三：schema.org 詞匯表片挂，Google豐富摘要詞匯表幻林，WHATWG / microformats.org詞匯表。

詞匯表音念，就是指定微數(shù)據(jù)項目的類型沪饺，聲明作用域的名稱。

2.3 數(shù)據(jù)模型

微數(shù)據(jù)的數(shù)據(jù)模型是名/值對闷愤，一個微數(shù)據(jù)的屬性名總是聲明在一個 HTML 元素上整葡，相對應的屬性值則從 DOM 中取得。

在項里的元素添加屬性名讥脐，就會成為所在的項目里的屬性遭居，屬性值是文本或者其他數(shù)據(jù)啼器。

三、微數(shù)據(jù)的語法

通過對下面例子的改造講解：

<section>
  <h1>destiny</h1>
  <p>![](http://upload-images.jianshu.io/upload_images/7295449-c6767031a780189f.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</p>
  <p><a >blog</a></p>
</section>

3.1 itemscope 項目的作用域

聲明元素為一個項目俱萍，包含至少一個屬性镀首。

<section itemscope>
  <h1>destiny</h1>
  <p>![](http://upload-images.jianshu.io/upload_images/7295449-c6767031a780189f.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</p>
  <p><a >blog</a></p>
</section>

3.2 itemtype 項目的類型

微數(shù)據(jù)定義的類型。其值為 URL鼠次，用于引入一個微數(shù)據(jù)詞匯表可以使用 http://schema.org 或是 http://data-vocabulary.org 域名

<section itemscope itemtype="http://data-vocabulary.org/Person">
  <h1>destiny</h1>
  <p>![](http://upload-images.jianshu.io/upload_images/7295449-c6767031a780189f.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</p>
  <p><a >blog</a></p>
</section>

3.3 itemprop 項目的屬性

添加一個數(shù)據(jù)項目屬性更哄。任何微數(shù)據(jù)屬性都可以重復，只要各自的值位于不同的 HTML 元素中腥寇。

<section itemscope itemtype="http://data-vocabulary.org/Person">
  <h1 itemprop="name">destiny</h1>
  <p>![](http://upload-images.jianshu.io/upload_images/7295449-c6767031a780189f.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</p>
  <p><a itemprop="url" >blog</a></p>
</section>

3.4 屬性值

數(shù)據(jù)屬性對應的屬性值是元素中的某個屬性或者文本的值

• content 屬性

  • <meta itemprop="" content="">

• src 屬性

  • audio
  • embed
  • iframe
  • img
  • source
  • video

• href 屬性

  • a
  • area
  • link

• data 屬性

  • object

• datetime 屬性

  • time

• 文本內容

  • 其他所有元素

3.4 嵌套項與多屬性

在包含 itemprop 的元素中添加 itemscope 插入嵌套項成翩。

<span itemprop="members" itemscope>S˙H˙E
  <span itemprop="name">任家萱</span>
  <span itemprop="name">田馥甄</span>
  <span itemprop="name">陳嘉樺</span>
</span>

項目可以包含不同值的多個相同屬性。如上例

同一個元素同樣也可以有多個屬性關鍵名稱赦役，用空格分隔麻敌。

<p itemscope>
  <span itemprop="name call">destiny</span>
</p>

3.5 itemref 頁面內引用

允許微數(shù)據(jù)項目通過指向特定 ID（含有需要屬性的元素）包含非后代屬性。

<p itemscope itemref="band-members">
  <span itemprop="name">S˙H˙E</span>
</p>
……
<span id="band-members" itemprop="members" itemscope>S˙H˙E
  <span itemprop="name">任家萱</span>掂摔，
  <span itemprop="name">田馥甄</span>和
  <span itemprop="name">陳嘉樺</span>
</span>

含有 itemref 屬性的元素項目會把 itemref 指定 id 的項目包含進來术羔。

3.6 標注不可見數(shù)據(jù)

如果你想添加的文本并不是頁面內容的一部分，你可以在 <meta> 元素上使用 content 屬性：<meta itemprop="" content="">

但是某些瀏覽器會自動把 <meta> 元素移動到 head 標簽中乙漓。比較靠譜的做法是使用 itemref 做頁面內引用级历，這樣即使瀏覽器移除了，還是能夠識別出微數(shù)據(jù)叭披。

<p itemscope>
  <span itemprop="name" itemscope itemref="meta-likes">
   鐘欣桐
    <meta id="meta-likes" itemprop="likes" content="twins成員">
  </span>
  攝影愛好者陳老師的粉絲寥殖。
</p>

注意：應當盡可能的使用可見數(shù)據(jù)，因為不可見的數(shù)據(jù)涩蜘，往往會被忽略嚼贡，更新時忘記修改⊥耄可以將不可見數(shù)據(jù)緊挨著它所描述的可見文本后面粤策，可以起到一定提醒作用。

3.7 itemid 全局標識符

允許詞匯表給微數(shù)據(jù)項目定義一個全局標識符误窖。
如書的 ISBN 數(shù)值

<p itemscope itemtype="http://vocab.example.com/book"  itemid="urn:isbn:0321687299">
  <!-- 書信息… -->
</p>

四叮盘、詞匯表

以 Google 豐富摘要詞匯表( data-vocabulary.org )為例。

4.1 Person 人物

設置 itemtype="http://data-vocabulary.org/Person"

包含屬性有：

• name 姓名
• nickname 昵稱
• photo 頭像贩猎，圖片鏈接
• title 頭銜熊户、職稱
• role 角色 （如：會計）
• url 個人網址萍膛，定義比較寬松
• affiliation 相關的組織名稱（如：雇主吭服、公司）
• friend 朋友（表示與另外一人的社會關系）
• contact 聯(lián)系方式（表示與另外一人的社會關系）
• acquaintance 熟人關系（表示與另外一人的社會關系）
• address 位置地址，可以是一個項目

4.2 Address 地址

Person 詞匯表定義了 address 屬性蝗罗，而 address 本身也是微數(shù)據(jù)項目艇棕，有自己的詞匯表：設置 itemtype="http://data-vocabulary.org/Address"

包含屬性有：

• country-name 國家
• region 省
• locality 縣蝌戒、地區(qū)
• street-address 街道地址
• postal-code 郵政編碼

對于沒有定義屬性的地址，如：鎮(zhèn)沼琉，可以寫入 locality 屬性中北苟。

注意：一般地址只用一個標簽包含，為了微數(shù)據(jù)的應用打瘪，應當為各個對應屬性增加一個標簽包含友鼻。雖然增加了標簽，但這樣做是值得的闺骚。其他情況也是如此

4.3 Organization 組織

設置 itemtype="http://data-vocabulary.org/Organization"

包含屬性有：

• name 組織名稱
• url 組織主頁鏈接
• address 組織地址彩扔，可以是一個項目
• tel 組織的電話號碼
• geo 地理位置坐標，可以是一個項目

4.4 Geo 地理位置

設置itemtype="http://data-vocabulary.org/Geo"

包含屬性有：

• latitude 緯度
• longitude 經度

一般使用不可見標注方式

4.5 Event 事件

設置itemtype="http://data-vocabulary.org/Event"

包含屬性有：

• summary 事件名稱
• url 事件詳情鏈接
• location 事件發(fā)生或活動舉行的地點或場所僻爽，可以有一個嵌套的組織或者地址來表示
• description 對事件的描述
• startDate 開始日期和時間虫碉，ISO 格式:2009-11-06T08:30+01:00
• endDate 結束日期和時間，ISO 格式
• duration 事件持續(xù)時間胸梆，ISO 格式
• eventType 事件類型（如講座敦捧、音樂會等）
• geo 事件的地理位置，可以是一個項目
• photo 事件相關圖片鏈接

4.6 Review 點評

設置itemtype="http://data-vocabulary.org/Review"

包含屬性有：

• itemreviewed 被點評的項目名稱碰镜，可以是產品兢卵、服務、商家等
• rating 對該項目的數(shù)字質量評級绪颖，默認檔次從 1 到 5济蝉，也可以前嵌套一個 Rating 項目
• reviewer 點評者姓名
• dtreviewed 點評日期，ISO 格式
• summary 關于點評的簡要說明
• description 點評詳細描述

4.7 Rating 等級

設置itemtype="http://data-vocabulary.org/Rating"

包含屬性有：

• value 獲得的評級
• worst 最差的等級菠发，0
• best 最好的等級