HTML5：元素 <组>答案

【问题标题】：HTML5: element <group>HTML5：元素 <组>
【发布时间】：2012-02-16 18:54:07
【问题描述】：

你建议什么有效的HTML5-tag，将一个或多个元素组合成一个组？

例子：

  <!-- Not valid, see below - just ignore -->
    <ul>
      <li>Test1<li>
      <group id="2"><li>Test 2</li></group>
      <li>Test2<li>
      <li>Test3<li>
    </ul>
 <!-- // -->

  <p>Test Text 1 <group id="3">Lorem ipsum dolor</group></p>

</body>
</html>

Javascript（带有 DOM-Utility）：

console.log($('group#2'));

【问题讨论】：

以上内容无效，因为<ul> 元素只允许<li> 元素作为直接子元素。
你说得对，我已经纠正了我的问题。我正在寻找一个抽象的解决方案，而不使用类标识符
您的编辑没有使问题更清楚，抱歉。一个列表元素和 p 中的一段文本以什么方式属于一起？
我的意思是，HTML5 是否让我们能够以尊重和有效的方式对元素的各个部分进行分组？

标签： javascript html w3c w3c-validation

【解决方案1】：

这取决于上下文。 Here is the spec for all grouping elements of block level（或者我喜欢this visualization）。你想要一些适合语义的东西。例如，如果你有一篇文章，你会想要使用<article> 标签。如果您要定义页面的一部分，请使用<section>。如果要对标头进行分组，请使用 <hgroup>。如果你在做 x，请使用 x 标签。

名单还在继续。为上下文找到合适的元素。但请注意，旧版浏览器不知道如何处理元素，因此您需要了解如何设置样式以及如何使用 JavaScript 查询元素。

【讨论】：

而且，如果您想对 <li> 和 <p> 之类的内容进行分组，请为它们分配相同的类名。还是有别的办法？
@bfavaretto 这取决于语义上下文。就像我在回答中所说的那样。没有毯子“对所有<p> 元素使用此标签”，因为HTML5 添加了额外的语义来使用。就像我说的，如果它是一篇文章的一部分，那么使用<article> 标签，如果它是……就这样继续。它是关于什么是最好的语义。类更多地用于将元素分类为不同的类。
我知道，我同意，但他似乎正在寻找将内容跨块分组的东西。例如，您有两个<article> 块，每个块内部都有一个不同的<span>，您出于某种原因想要将它们组合在一起（例如从 js 访问，就像在 OP 中一样）。那么唯一的方法就是给两个跨度同一个类。
@bfavaretto OP 使用的组标签具有不同的ids，因此将是不同的组。但是如果他们试图从不同的块上下文中选择它们，那么是的，一个类可能是合适的。然而，在两个<section> 标签中并使用<section> 标签选择它也可能是合适的。或者其他一些标签。没有具体的例子总是很难说。
让开发人员能够定义自己的自定义 HTML5 标记范围不是更好吗？ 保留元素的一个范围和自定义标签的另一个开放范围。我认为这是最新的 w3c 规范的一个缺点。你怎么看？

【解决方案2】：

在这种情况下，您应该只使用类名：

<li class="group2">Test 2</li>

【讨论】：

这确实给了它们相同的类属性，是的，但我认为通过对 OP 进行分组确实意味着更像是围绕它们的字段集或其他东西。