介绍HTML5“菜单”和“菜单项”元素

今天，我将向您介绍两个HTML5元素： <menu>和<menuitem> ，它们是Interactive Elements规范的一部分。 网络已经发展为不仅仅是链接文档。 如今，网页的行为越来越像应用程序。 因此，现在是形成标准Web交互功能的适当时间。

这两个元素在开发人员中讨论最少，可能是由于它们在主要浏览器中缺乏支持。 在撰写本文时，Firefox是唯一实现此元素的浏览器。

菜单与导航元素

当我们谈论menu时，一定不要与<nav>混淆。 该规范在定义这两个不同元素之间的差异方面做得很好。

<nav>是HTML导航元素 。 它是代表网页导航块的元素。 它通常包含一组链接，这些链接使用户可以导航或跳至该页面或网站的另一页面上的部分。

另一方面， <menu>代表一组菜单命令。 这个想法类似于台式机或移动应用程序。 桌面应用程序通常使用工具栏菜单和上下文菜单来执行各种任务。 以Photoshop中的“ 模糊”菜单为例。 这将执行使所选图层模糊的任务。

这是这两个元素之间的根本区别。 <nav>应该包含帮助用户浏览网页的链接，而<menu>元素应该帮助用户执行某些任务。

使用菜单元素

简而言之， <menu>元素旨在创建上下文菜单，工具栏和弹出菜单。 但是，其中的后两者尚未在包括Firefox在内的任何浏览器中实现。 目前，很难猜测浏览器将如何实现它们以及它们的外观。 在下一次迭代中，工具栏和弹出菜单规范也很有可能会稍有变化。

现在，我们将注意力集中在上下文菜单功能上。

上下文菜单

右键单击应用程序时，将显示一个上下文菜单（或上下文菜单）。 显示的选项特定于用户单击的位置，因此特定于上下文 。

JavaScript选项

可以通过