了解 2024 年 6 月已在稳定版和 Beta 版网络浏览器中推出的一些有趣功能。
稳定版浏览器
2024 年 6 月,Firefox 127 和 Chrome 126 已稳定发布。本文将介绍 Web 平台中新增的功能。
JavaScript Set 方法
集是任何编程语言中必不可少的数据结构。现在,您可以使用 JavaScript 的内置方法执行集合运算。以下 set 方法现已在 Firefox 127 中推出,并已成为“新推出的基准”的一部分:
intersection()
union()
difference()
symmetricDifference()
isSubsetOf()
isSupersetOf()
isDisjointFrom()
如需了解详情,请参阅 JavaScript Set 方法现已纳入基准。
Async Clipboard API
从 Firefox 127 开始,剪贴板 API 已获得全面支持。Firefox 现在支持 ClipboardItem
接口以及剪贴板接口的 read()
和 write()
方法。如需详细了解 Clipboard API,请参阅解除阻止剪贴板权限。
CSS 渐变中的颜色插值
CSS 渐变色已指定接受 <color-interpolation-method>
,Firefox 现在也支持此功能,这使得其可在所有主要引擎中互操作。例如,您现在可以使用 hsl 颜色系统和更长的插值来指定 linear-gradient()
。
.longer {
background: linear-gradient(90deg in hsl longer hue, red, blue);
}
浏览器支持
跨文档视图转换
以前,您必须将网站重构为 SPA,才能使用 View Transitions API。现在,情况不再如此。从 Chrome 126 开始,对于同源导航,视图转换现在默认处于启用状态。您可以在两个不同的同源文档之间创建视图转换。
如需启用跨文档视图转换,需要同时在发起端和接收端选择启用。为此,请使用 @view-transition
at-rule 并将导航描述符设置为 auto
。
@view-transition {
navigation: auto;
}
浏览器支持
如需了解详情,请参阅跨文档视图转换文档。
Gamepad API trigger-rumble
扩展程序
Chrome 126 扩展了 GamepadHapticActuator
接口,以便在网络上公开 trigger-rumble
功能,以供兼容的游戏手柄使用。借助此扩展程序,利用 Gamepad API 的 Web 应用还可以振动配备此功能的游戏手柄设备的扳机。
Beta 版浏览器
通过浏览器 Beta 版,您可以预览下一个稳定版浏览器中将推出的功能。在该版本面向全球发布之前,您可以先测试可能会影响您网站的新功能或移除的功能。新版 Beta 版为 Firefox 128、Chrome 127、Safari 18 和 Safari 17.6。这些版本为该平台带来了许多出色的功能。如需了解所有详情,请参阅版本说明。下面仅列举了其中的几个亮点。
Safari 17.6 修复了现有功能的问题。Safari 18 提供了许多令人兴奋的新功能,包括样式容器查询、适用于单页面应用的视图转换 API,以及对 flexbox 属性中的 safe
关键字的支持。
Chrome 127 包含 font-size-adjust
CSS 属性,可将生成内容的替换文本指定为任意数量的元素,还可在 MediaMetaData
中添加单个章节信息。
Firefox 128 包含 CSS 属性和值,因此此功能处于“新推出的基准”状态。使用 @property
定义 type
,并为 CSS 自定义属性设置回退值。