关于前端:微数据

40次阅读

共计 1577 个字符,预计需要花费 4 分钟才能阅读完成。

一、微数据介绍

Microdata 是在网页中提供额定语义的规范形式。

Microdata 可定义本人的自定义元素,并开始在网页中嵌入自定义属性。在高水平上,微数据由一组名称 – 值对组成。

微数据应用来自自定义词汇表的、带作用域的名 / 值对来给 DOM 做标记,微数据的实质就是 JSON。

二、微数据理论利用举例

个别写法:

<div>
  我的名字是大熊,但大家叫我小熊。我的集体首页是:<a href="http://www.example.com">www.example.com</a>
  我住在徐州市。我是工程师,目前在科技公司下班。</div>

而如果应用针对人物的微数据标记,则 HTML 会如下:

<div itemscope itemtype="http://data-vocabulary.org/Person">
  我的名字是 <span itemprop="name"> 大熊 </span>,但大家叫我 <span itemprop="nickname"> 小熊 </span>。我的集体首页是:<a href="http://www.example.com" itemprop="url">www.example.com</a>
  我住在徐州市。我是 <span itemprop="title"> 工程师 </span>,目前在 <span itemprop="affiliation"> 科技公司 </span> 下班。</div>

HTML 代码量多了不少,还呈现了很多自定义的属性,如 itemscope, itemtype, itemprop 等。这些属性就是方面机器辨认的特定的标记。

Live Microdata 对下面的 HTML 代码跑一下:

{
  "items": [
    {
      "type": ["http://data-vocabulary.org/Person"],
      "properties": {
        "name": ["大熊"],
        "nickname": ["小熊"],
        "url": ["http://www.example.com/"],
        "title": ["工程师"],
        "affiliation": ["科技公司"]
      }
    }
  ]
}

三、属性介绍

属性 形容
itemscope 申明所应用的作用域
itemtype 微数据定义的类型。其值为 URL,表演词汇表名称的作用
itemid 容许词汇表给微数据项定义一个全局标识符,例如书的 ISBN 数值,在同样元素上应用 itemid 作为数据项的 itemscope 和 itemtype 属性
itemprop 增加一个数据项属性
itemref 此属性提供了一个附加元素列表,用于爬网以查找该项目标名称 – 值对。

itemref 应用举例

<p itemscope itemref="test-members"> 我要去看 <span itemprop="name">flower</span> 的演唱会,好开心 </p>
<span id="test-members" itemprop="members" itemscope>flower 的成员是
  <span itemprop="name"> 小乐 </span>,<span itemprop="name"> 田甜 </span> 和
  <span itemprop="name"> 华立 </span>
</span>
{
  "items": [
    {
      "properties": {
        "name": ["flower"],
        "members": [
          {
            "properties": {
              "name": [
                "小乐",
                "田甜",
                "华立"
              ]
            }
          }
        ]
      }
    }
  ]
}

下面的定义通过援用 ID test-members 蕴含了 members 项的三个成员名称属性,每个都是不一样的值。

四、总结

微数据是为了不便机器辨认而产生的货色,有特定的标准和特定的格局,能够丰盛搜索引擎的网页摘要。

写在最初

词汇表介绍

  1. schema.org 词汇表
  2. Google 丰盛摘要词汇表
  3. WHATWG/microformats.org 词汇表

正文完
 0