Invoker commands

概要

command / commandfor 属性により、ボタンクリック時のターゲット要素への動作（dialog表示、popover切替等）を宣言的に記述できます。

対応ブラウザ

基本構文

<button commandfor="my-dialog" command="show-modal">
  ダイアログを開く
</button>
<dialog id="my-dialog">
  <p>コンテンツ</p>
  <button commandfor="my-dialog" command="close">閉じる</button>
</dialog>

実務での使いどころ

• Invoker commands の活用

  Invoker Commands。ボタンのcommand属性で要素の動作を宣言的に指定。

注意点

アクセシビリティ

• スクリーンリーダーでの読み上げを確認すること。

参考リンク

• MDN Web Docs — Invoker commands