我们什么时候可以使用HTML6?嗯,WHATWG –推动HTML规范更改的标准机构–已决定实施“活动文档”方法进行标准化。这意味着我们所谓的“ HTML6”不太可能是一个巨大的更新,而是更有可能包含对规范的较小更改,而更改的发生频率更高。
但是,HTML规范一直都在修订和改进。浏览器供应商一直在忙于实施最新功能以发布到更广阔的世界,这意味着我们总是会尝试一些新功能。有一些值得注意的变化-请阅读两个改变游戏规则的内容。
本机模态
进入浏览器的一种更改是<dialog>元素。这相当于JavaScript支持的模式窗口,这是许多站点上的常见设计模式。
<dialog open>
<p>This is a HTML-powered dialog box.</p>
</dialog>
可以通过切换open属性来打开和关闭它。默认情况下,它将显示在页面上的上方悬停。然后,通过JavaScript 调用其openModal方法将使用更熟悉的类似模式的界面。
默认情况下,背景变为灰色,其下方的内容不再是交互式的。
<dialog>
<form method="dialog">
<input type="submit" value="Yes" />
<input type="submit" value="No" />
</form>
</dialog>
模态对话框内形式可以具有方法的属性对话框,这将提交的值和传递值返回到对话对象本身。这使<dialog>成为确认动作或其他小的交互的绝佳工具。
该元素已经标准化,目前只有Chrome和Samsung Internet浏览器具有完全支持。那些没有显示的内容仍将显示对话框的内容,但将其放置在页面内。
更智能的菜单
某些Web应用程序允许用户在其界面中执行动作组。这些将以某种形式影响当前页面,例如将项目添加到列表中。
以前,这些标记为<ul> -用户可以执行的无序操作列表。尽管<ul>用于显示项列表,但它并非最适合交互式元素。
<menu type="toolbar">
<li><button>Cut</button></li>
<li><button>Copy</button></li>
<li><button>Paste</button></li>
</menu>
菜单包含一组动作,这些动作将由其中的<button>元素触发。除此之外,<menu>元素的行为与通常的项目列表没有什么不同。随着浏览器采用率的提高,它可以帮助辅助技术更轻松地找到这些交互元素。