Html HTML5 什么是 itemscope 属性以及它在外行方面的作用是什么?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4158876/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 05:13:48  来源:igfitidea点击:

HTML5 what is the itemscope attribute and what does it do in laymans terms?

html

提问by delimit

I just wanted to know what is the HTML5 itemscope attribute used for basically?

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

回答by zzzzBov

The [itemscope]attribute is a boolean attribute to define the scope of the metadata contained within the element.

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

It's defined in the HTML5 MicrodataAPI:

它在HTML5 微数据API 中定义:

Every HTML element may have an itemscopeattribute specified. The itemscopeattribute is a boolean attribute.

An element with the itemscopeattribute specified creates a new item, a group of name-value pairs.

每个 HTML 元素都可以itemscope指定一个属性。该itemscope属性是一个布尔属性。

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

In other words, it's a way of associating metadata with a particular DOM node.

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

This is used by the Schema.orgAPI to associate data for search engines and social networks. Google+ uses schemaas the way to provide titles, thumbnails, and descriptions for pages shared by users.

这是通过使用Schema.orgAPI为搜索引擎和社交网络相关联的数据。Google+ 使用架构作为为用户共享的页面提供标题、缩略图和说明的方式。



It should also be noted that [itemscope]and [itemprop]are compatible with Facebook's Open Graph Protocolwhen providing meta data for a webpage. The same metadata can be listed for search engines, Facbook, and Google+ in a single set of <meta>elements rather than having to list the same information more than once:

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

<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>

Note that in the example, [itemscope]was added to the <html>element. This means that any [itemprop]attributes in the <head>and <body>are part of the WebPageitem.

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

回答by Bryan

Search engines including Bing, Google, and Yahoo! are now using itemscopeand friends to identify semantic data in webpages. On the website schema.org, they have an explanation of how to use itemscopewith predefined schemas to improve the data that is provided to search engines.

搜索引擎包括 Bing、Google 和 Yahoo! 现在正在使用itemscope和朋友来识别网页中的语义数据。在网站schema.org 上,他们解释了如何使用具有预定义架构的itemscope来改进提供给搜索引擎的数据。

http://schema.org/docs/gs.html

http://schema.org/docs/gs.html