使用HTML5 + Microdata的<meta />标签

Question

我想使用Schema.org使用HTML5 + Microdata的<meta>代码指定产品是否为“有货”。

我不确定这是否是正确的语法：

<div itemscope itemtype="http://schema.org/Product">
  <h2 itemprop="name">Product Name</h2>
  <dl itemprop="offers" itemscope itemtype="http://schema.org/Offer">
    <dt itemprop="price">$1</dt>
    <meta itemprop="availability" itemscope itemtype="http://schema.org/ItemAvailability" itemid="http://schema.org/InStock">
  </dl>
</div>

Answer 1

meta标记不能与像这样的itemcope一起使用。表达此信息的正确方法是使用link标记的规范参考：

<div itemscope itemtype="http://schema.org/Product">
  <h2 itemprop="name">Product Name</h2>
  <dl itemprop="offers" itemscope itemtype="http://schema.org/Offer">
    <dt itemprop="price">$1</dt>
    <link itemprop="availability" href="http://schema.org/InStock">
  </dl>
</div>

Answer 2

我做了与OP相同的事情并得到了相同的东西，测试工具的可用性链接到一个子项......我终于能够正确地验证它了：

<meta itemprop='availability' content='http://schema.org/InStock'>

以下是该优惠的Google结构化工具输出：

Item 1
type:   http://schema.org/offer
property:   
price:  Price: $139.00
pricecurrency:  USD
availability:   http://schema.org/InStock

Answer 3

虽然在meta中body使用dl（如果用于微数据！），但由于以下几个原因，您的示例不正确：

• dt元素只能包含dd或script（和template / meta）元素。您必须将dt置于dd / dl内或itemscope之外（但之后您必须移动meta）。< / p>

• content元素必须具有itemid属性。

• 为此目的使用http://schema.org/ItemAvailability不正确，itemscope不是类型，因此使用itemtype + itemprop也不正确。< / p>

• 但是，如果link值是URI，则allowed使用meta元素而不是price元素。

此外，dt值不应包含货币符号，并且您的dd实际上应该是dt（<dl itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <dt>Price</dt> <dd>$<span itemprop="price">1</span> <link itemprop="availability" href="http://schema.org/InStock" /></dd> </dl> 包含＆＃34 ;价格＆＃34;或其他）。

所以你可以使用：

<script type="text/javascript">
  $(document).ready(function() {
    $("input[name='next']").on("click", function() {
      // console.log( "The NEXT Button Worked!" );
      $(".form").css("transform", "rotateY(180deg)");
    })
    $("input[name='back']").on("click", function() {
      // console.log( "The BACK Button Worked!" );
      $(".formFlipAgain").css("transform", "rotateY(180deg)");
    })
  });



  function showBack() {
    setTimeout(function() {
      document.getElementById("backSide").style.display = "block";
    }, 600);
    setTimeout(function() {
      document.getElementById("frontSide").style.display = "none";
    }, 600);
  };

  function showFront() {
    setTimeout(function() {
      document.getElementById("frontSide").style.display = "block";
    }, 600);
    setTimeout(function() {
      document.getElementById("backSide").style.display = "none";
    }, 600);
  };

Answer 4

我在这里制作了一个jsfiddle：http://jsfiddle.net/dLryX/，然后将输出（http://jsfiddle.net/dLryX/show/）放入丰富的片段工具中。

回来时：

我认为语法是正确的，并且警告并不重要，因为它没有属性，因为它是元标记。

Answer 5

请参阅标题不可见的内容（不确定这是否有帮助）：

Google webmaster tools - About microdata

  

通常，Google不会显示用户不可见的内容。换句话说，不要以一种方式向用户显示内容，并使用隐藏文本分别为搜索引擎和Web应用程序标记信息。您应该在用户访问您的网页时标记实际显示的文字。

     

本指南有一些例外情况。在某些情况下，为搜索引擎提供更详细的信息可能很有价值，即使您不希望页面访问者看到该信息。例如，如果餐馆的评级为8.5，则用户（但不是搜索引擎）将认为评级基于1-10的等级。在这种情况下，您可以使用元素指示这一点，如下所示：

     

<div itemprop="rating" itemscope itemtype="http://data-vocabulary.org/Rating"> Rating: <span itemprop="value">8.5</span> <meta itemprop="best" content="10" /> </div>

Answer 6

This is an example来自schema.org的入门指南，以支持@Lawrence的回答。

但是，我不喜欢在页面正文中使用链接标记。来自MDN：

  

链接标记只能出现在head元素中;

使用有效标记是否有更好的方法来指定可用性？