HTML是否允许在导航部分内放置按钮？

Question

spec says关于<nav>元素的内容（强调我的意思）：

  

nav元素表示页面中链接到其他页面 或页面中各个部分的部分：具有导航链接的部分

它从未明确指出禁止使用<button>，也没有地方说过只能使用<a>元素进行导航（尽管它提到了“链接”），但是所有示例似乎都是一堆锚列表中。不是列表的one example (11)仍然只具有用于导航的锚点元素。

next example (12)显示了应用程序内导航的示例，但再次使用了锚点。

那么，<nav>内是否允许按钮元素？

Answer 1

在HTML 5.2中，section 4.8.与链接有关：

  

链接是由a，area和link元素创建的概念性构造，它们表示两个资源[…]

之间的连接

正如人们所期望的，a（“超链接”），area（“超链接”）和link（“链接”）的定义等），所有链接均指向链接，而button和input的定义则不链接。

所以：

• 一个nav元素应包含具有href属性（a / area / link）的元素。否则，不保证首先使用nav（除了例外）。

• 一个nav元素也可能包含按钮。例如，一个按钮，用于在显示导航的所有级别和仅显示顶层之间进行切换。 （但是，如果按钮用于导航，则无论如何它们都应该是链接而不是按钮。）

Answer 2

HTML5标准允许<nav>标签内的任何类型的流内容，并且<button>标签被视为流内容，但是出于语义原因，您应考虑避免使用它们。基于<button>的按钮是UI元素，这些元素完全由javascript驱动（或在某些棘手的情况下，使用表单时浏览器的默认行为），而没有对第三者引用的任何功能或语义引用。因此，在<button>标记内使用<nav>标记对不考虑javascript的客户/机器人毫无意义。

现代UI框架（如Bootstrap，Semantic-UI或其他）确实提供了以多种方式（如<button>标签和<a>标签）来实现按钮的功能。考虑到这些功能，出于语义原因，您应该更喜欢使用基于<a>标签的按钮。

Answer 3

取决于您定义“允许”的方式。

这是有效的HTML，但是您可能想了解可访问性以及按钮（应表示可点击的操作）和链接（应导航到某处）之间的区别。

http://web-accessibility.carnegiemuseums.org/content/buttons/