HTMLButtonElement: command プロパティ
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
command
は HTMLButtonElement
インターフェイスのプロパティで、このボタンで制御される要素で実行されるアクションを取得し、設定します。これに効果を持たせるには、commandfor
を設定する必要があります。
これは HTML の command
属性を反映します。
値
文字列です。有効な値については command
属性の記事を参照してください。
例
基本的な例
html
<button id="toggleBtn" commandfor="mypopover" command="toggle-popover">
ポップオーバーをトグル切り替え
</button>
<div popover id="mypopover">
<button commandfor="mypopover" command="hide-popover">
ポップオーバーを非表示
</button>
</div>
js
const popover = document.getElementById("mypopover");
const toggleBtn = document.getElementById("toggleBtn");
toggleBtn.command = "show-popover";
イベントを使用した独自の例
html
<button commandfor="the-image" command="--rotate-left">左回転</button>
<button commandfor="the-image" command="--rotate-right">右回転</button>
<img id="the-image" src="photo.jpg" alt="[ここに適切な代替テキストを追加]" />
js
const image = document.getElementById("the-image");
image.addEventListener("command", (event) => {
if (event.command == "--rotate-left") {
event.target.style.rotate = "-90deg";
} else if (event.command == "--rotate-right") {
event.target.style.rotate = "90deg";
}
});
仕様書
No specification found
No specification data found for api.HTMLButtonElement.command
.
Check for problems with this page or contribute a missing spec_url
to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.
ブラウザーの互換性
BCD tables only load in the browser