Question

我有兴趣详细了解HTML5 <main>元素与ARIA地标角色属性role="main"之间的关系以及可能的区别。

我的印象是<main>元素的目的是将ARIA卷属性role="main"映射到特定的HTML元素。但这总结了吗？

使用<main>比使用<div role="main">更有好处吗？或者，现在和可预见的未来，这些结果会产生相同的结果吗？

我们将非常感谢您在比较以下示例时的任何见解：

<body>
  <main>
    <p>Paragraph</p>
  <main>
</body>

<body>
  <main role="main">
    <p>Paragraph</p>
  <main>
</body>

<body>
  <div role="main">
    <p>Paragraph</p>
  <div>
</body>

Answer 1

根据HTML5 Doctor，它们是等效的。 <main>只是让实施role="main"更容易，更简洁。

主要目的是将ARIA的里程碑角色main映射到HTML中的元素。

以下是<main>元素的一般说明。

main元素表示文档或应用程序的body的主要内容。主要内容区域包含与文档中心主题或应用程序中心功能直接相关或扩展的内容。

建议在浏览器正确实施<main>之前，在同一元素中同时使用role="main"和<main>。

<!-- Recommended -->
<main role="main">
    ...
</main>

如果您有兴趣，请务必阅读<main> spec。

正如Szabolcs在评论中指出的那样，<main>不是分段元素，因此它应该与<section>元素一起使用。