了解 2024 年 6 月在稳定版和 Beta 版网络浏览器中推出的一些有趣功能。
稳定版浏览器
2024 年 6 月,Firefox 127 和 Chrome 126 开始稳定。这篇博文介绍了 Web 平台中新增的功能。
JavaScript Set 方法
在任何编程语言中,集都是必不可少的数据结构。现在,您可以使用 JavaScript 的内置方法执行 set 操作。以下 set 方法现已从 Firefox 127 提供,并已纳入 Baseline NewAvailable 计划的一部分:
intersection()
union()
difference()
symmetricDifference()
isSubsetOf()
isSupersetOf()
isDisjointFrom()
如需了解详情,请参阅 JavaScript Set 方法现已纳入 Baseline。
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);
}
浏览器支持
- 111
- 111
- 127
- 16.2
跨文档视图转换
以前,您必须将网站重新设计为 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 版为 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 自定义属性设置后备值。