HTML5 什么是 itemscope 属性?用外行人的话来说它有什么作用?

2024-04-28

我只是想知道 HTML5 itemscope 属性的基本用途是什么?


The [itemscope]attribute 是一个布尔属性,用于定义元素中包含的元数据的范围。

它定义在HTML5 微数据 http://www.w3.org/TR/microdata/#attr-itemscope API:

每个 HTML 元素可能有一个itemscope属性指定。这itemscope属性是一个布尔属性。

一个元素与itemscope指定的属性创建一个新的item,一组名称-值对。

换句话说,它是一种将元数据与特定 DOM 节点关联的方法。

这是由Schema.org http://schema.org/用于关联搜索引擎和社交网络数据的 API。Google+ 使用架构 http://schema.org/WebPage作为为用户共享的页面提供标题、缩略图和描述的方式。


还应该指出的是[itemscope] and [itemprop]与 Facebook 兼容开放图协议 https://developers.facebook.com/docs/opengraphprotocol/为网页提供元数据时。可以在一组数据中列出搜索引擎、Facbook 和 Google+ 的相同元数据<meta>元素,而不必多次列出相同的信息:

<html itemscope itemtype="http://schema.org/WebPage" xmlns:fb="https://www.facebook.com/2008/fbml">
  <head>
    <title>An Example Title</title>
    <meta content="An Example Title" itemprop="name" property="og:title" />
    <meta content="Lorem ipsum dolor sit amet" itemprop="description" name="description" property="og:description" />
    <meta content="http://www.example.com/image.jpg" itemprop="image" property="og:image" />
    <meta content="http://www.example.com/permalink" itemprop="url" property="og:url" />
    <link rel="canonical" href="http://www.example.com/permalink" />
  </head>
  <body>
    ...content...
  </body>
</html>

请注意,在示例中,[itemscope]被添加到<html>元素。这意味着任何[itemprop]中的属性<head> and <body>是的一部分WebPage item.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML5 什么是 itemscope 属性?用外行人的话来说它有什么作用? 的相关文章

随机推荐