HTML对话框已经勾留了一段韶光，但是直到最近，它还不是W3C推举规范的一部分。既然主流浏览器已经开始支持对话元素，我们很可能会看到它被广泛利用。本文简要先容了我们如何利用对话框，为什么须要新的元素以及如何利用它。
什么是对话框？对话框是一种可用于多种办法的设计模式，包括但不限于：显示主要信息，要求用户选择或扩展现有内容。虽然对话可以以不同的办法进行，但是最常用的是模态，与叠加层中的其他内容隔离。
为什么须要对话框元素？直到新元素发布，要实现一个对话框到一个网站，你将不得不从头开始编写或利用外部库 - 这种组件没有标准的语法或默认样式。缺少标准意味着浏览器和屏幕阅读器等赞助技能默认情形下无法区分对话框干系内容和其他页面内容。
为理解决可访问性问题，开拓职员必须利用aria属性（如role =“dialog”）来描述对话框中的内容。精确管理键盘焦点对付利用对话框的可访问性也很主要，例如，对话框中必须至少有一个可调焦的控件。
一些伟大的库被创建，使开拓者更随意马虎实现可访问的对话框，比如Edenspiekermann的A11y Dialog。除了这样的库之外，像Bootstrap和Foundation这样的CSS框架也使得它们内置的模式/对话框变得可用。
只管本日这些库和框架仍旧是干系的和有用的，但是具有用于对话确当地HTML元素确保了这样的常常利用的设计模式对付每个人都是很好的语法，标准和可访问性。其余，在浏览器中内置对话逻辑可以节省那些宝贵的代码字节！
现在我们明白为什么须要这个了，我们来看看我如何利用对话框元素。
HTML代码对话框元素的标记就像在<dialog>标签中包装一些内容一样大略。为了使对话框起浸染，我们须要一个按钮来打开它，还有一个按钮可以关闭或者撤销它。
要使对话框默认打开，可以添加一个打开的属性。
如果您的对话框包含一个表单，则表单元素的方法属性应设置为对话框。
JavaScript代码
没有JavaScript，对话元素将不会交互。我们可以将上面的HTML例子中的按钮和对话框元素连接到一些点击事宜监听器。
便是这样，我们有一个可以正常运行本地化的对话框！
对话框元素的默认样式不汇合适每个人的口味......比较幸运的是，我们可以用CSS来设计样式。
还有一个backdrop可以帮助我们选择不同的背景
完全demo演示如下：
支持
早在2014年，Chrome和Opera就开始支持对话元素，最近又推出了Chrome Android和三星浏览器。它也支持Firefox，但必须通过about：config启用。只管有几个紧张的浏览器不支持dialog，但有一个很好的polyfill可用。
