HTML 5.2中有些什么新变化？

HTML 5.2中有些什么新变化？

原文标题：What’s New in HTML 5.2?

作者：Ire Aderinokun

翻译：疯狂的技术宅

不到一个月前，HTML 5.2成为W3C官方的推荐标准（REC）。 当一个规范进入REC阶段时，就意味着它已经得到了W3C成员和负责人的正式认可，并且W3C正式把它推荐推荐给用户进行部署，并且由网页开发人员实施。

在REC阶段，任何新的特性应该至少有2个独立的实现。 这对于我们网页开发人员来说是开始实现任何新功能的好时机。

在HTML 5.2中，有一些内容被增减，详情可以在官方的HTML 5.2 Changes页面上看到（https://www.w3.org/TR/html52/changes.html#changes）。 在本文中，我会介绍一些影响到我的变化。

新功能

一个本地的 元素

在HTML 5.2的所有变化中，引入 元素（一个本地对话框）是令我最兴奋的事情。 对话框在web上非常流行，但是它们实现方式都有所不同。 对话框也很难做到易于访问，这导致 web 上的大多数对话框实际上无法服务于不以可视形式浏览 web 的用户（译者注：例如为盲人转换为语音）。

新的元素旨在改变这一点，提供了一个简单的方法来包含一个模态对话框，而不必担心很多的缺陷。 我将写一篇关于这个元素是如何工作的单独的，详细的文章，但这里有一些基础知识。

该对话框使用 元素创建：

默认情况下，除非应用了打开属性，否则该对话框将从视图（并从DOM访问）中隐藏。

属性可以通过调用 和 方法来切换，任何 都可以使用这个方法。

Chrome浏览器中已经有了 元素的支持，并且在Firefox中有一个标志。

使用iFrames中的Payment Request API

Payment Request API(https://www.w3.org/TR/payment-request/)是签出表单的本地替代方案。它的目的是提供一个标准化的和一致的方法，使在网上支付的用户，将付款信息的检索操作放到浏览器，而不是在每个网站上去逐个查看自己的账单。

在HTML 5.2之前，这些支付请求不能通过嵌入在文档中的iframe来完成。 这使得第三方嵌入式支付解决方案（例如Stripe，Paystack）基本上不可能利用这个API，因为它们的支付接口通常是在iframe中处理的。

HTML 5.2引入了 属性，该属性应用于iframe时，将允许它在用户处于托管网页时使用Payment Request API。

苹果设备的图标大小

要定义网页图标，我们使用文档头部的 元素。 要定义不同大小的图标，可以使用 属性。

这个属性虽然纯粹是个建议，但是如果有多个尺寸可用的话， user agents可以决定使用哪个尺寸的图标，特别是当大多数设备都有自己的“最佳”图标尺寸时。

在HTML 5.2之前， 属性只有在链接关系是图标时才有效。 但是，Apple的iOS设备不支持 属性。 为了解决这个问题，苹果推出了一个设备专用关系 ，可以用来定义设备上使用的图标。

在HTML 5.2中，如果关系是 ，就不再只是图标了，现在规范允许使用 属性。 这将允许我们为不同的苹果设备提供不同大小的图标。 虽然，据我目前所知，苹果设备仍然不支持 属性，但是如果他们愿意的话，这个变化是非常用的。

最新的有效编写方法

除了上述新功能，HTML 5.2还支持了一些以前无效的HTML的编写方法。

多个 元素

元素表示网页的主要内容。 尽管在多个页面上重复的内容可以放置在标题，部分或任何其他元素中，但 元素是为特定页面的特定内容保留的。 因此，在HTML 5.2之前，DOM中的 元素必须是唯一的，才能使页面有效。

然而随着单页应用的普及，坚持这一规则可能是困难的。 在DOM中可能有多个 元素，但是在任何给定的时间只能有一个被显示给用户。

使用HTML5.2，我们现在可以在我们的标记中有多个 元素，只要在给定的时间内只有一个对用户是可见的。 任何额外的元素必须使用隐藏属性隐藏。

我们知道，有几种方法可以用CSS隐藏元素。 但是，任何额外的 元素都必须使用 属性来隐藏。 任何其他隐藏该元素的方法，例如 或 将失效。

在 中的样式

通常，使用 元素定义的内联CSS被放置在HTML文档的 内。 随着组件化开发的增加，开发人员已经看到了编写和放置样式以及与其相关的html元素的好处。

在HTML 5.2中，现在HTML文档的 内的任何地方定义了一个嵌入的 块。 这意味着我们可以使风格更接近他们使用的地方。

但是，仍然注意到，出于性能原因，样式应该优选地放置在 中。根据规范，

样式元素应该最好用在文档的头部。 在文档的主体中使用样式可能导致重新设置，触发布局和/或导致重新绘制，因此应该小心使用。

还应该注意的是，如示例所示，样式不在作用域内。 稍后在HTML文档中定义的内联样式仍然适用于之前定义的元素，这就是为什么它可能会触发重绘。

标题在 中

在表单中， 元素表示 中表单字段的标题。 在HTML 5.2之前，图例的内容必须是纯文本。 现在，我们可以包含标题元素。

当我们想要使用 元素来组织表单的不同部分时，这非常有用。 在这种情况下，使用标题是非常有意义的，这使得依赖于文档大纲的用户可以更轻松地导航这些表单部分。

删除的功能

在HTML 5.2中，删除了一些元素，即：

：用于帮助生成表单的公钥

和 ：用于创建导航或上下文菜单

最近失效的做法

最后，一些开发实践已经失效。

没有内联，浮动或 的块级子元素

在HTML 5.2中， 元素的唯一有效子元素应该是短语内容。 这意味着以下类型的元素不应该嵌套在一个段落中：

内联块

内联表

浮动和定位块

没有了严格的文件类型

最后，我们可以告别以下严格的文件类型：