介绍命令和 commandfor | 博客 | Chrome for Developers

主要观点:按钮对动态网页应用很重要,传统构建按钮行为方式有挑战,Chrome 135 引入新commandcommandfor属性可改善按钮相关问题。
关键信息

  • 传统方式需处理aria-expanded等,不同框架有不同模式,如 React、AlpineJS、Svelte 等。
  • commandcommandfor可声明式执行其他元素操作,完全替代popovertargetactionpopovertarget
  • command有内置行为如show-popover等,可映射到相应 JavaScript 方法并优化无障碍等。
  • 可定义自定义命令--前缀,可跨 ShadowDOM 用 JavaScript API 设置.commandForElement
  • 未来将继续探索新内置命令,欢迎社区提建议。
    重要细节
  • 传统代码示例展示不同框架下处理按钮与弹出框交互的方式。
  • 新属性使用示例,如打开菜单按钮和确认对话框示例。
  • 自定义命令示例及相关 JavaScript 处理。
  • ShadowDOM 中commandfor属性的限制及跨根设置方法。
  • 未来探索的新内置命令方向及相关提议。
阅读 7
0 条评论