<output>: 出力要素

HTML の出力要素 (<output>) は、サイトやアプリが計算結果やユーザー操作の結果を挿入することができるコンテナー要素です。

コンテンツカテゴリ フローコンテンツ、記述コンテンツ、フォーム関連要素 (リスト化、ラベル付け可能、リセット可能)、知覚可能コンテンツ
許可された内容 記述コンテンツ
タグの省略 不可。開始と終了タグの両方が必要。
許可された親要素 記述コンテンツを受け入れるすべての要素
暗黙の ARIA ロール status
許可された ARIA ロール すべて
DOM インターフェイス HTMLOutputElement

属性

この要素にはグローバル属性があります。

for
他の要素の id の空白区切りのリストで、入力値が計算に使用される (または何らかの影響を与える) 要素を示します。
form
この要素に関連付けられた (フォームオーナーである) <form> 要素を指定します。この値は、同じ文書内の <form> 要素の id である必要があります。 (この属性が設定されていない場合、 <output> 要素は祖先の <form> があれば、その要素に関連づけられます。
この属性は <output> 要素を、包含する <form> に限らず文書中のどこにある <form> にも結び付けることができます。これは祖先の <form> 要素を上書きもします。
name
要素の名前です。 form.elements API で使用されます。

<output> の値、名前、内容はフォーム送信の過程で送信されません。

例

以下の例では、フォームに 0 から 100 までの範囲の値を取るスライダーと、第2の値を入力できる <input> 要素があります。どちらかのコントロールの値が変更されるたびに、2つの値が合計された結果が <output> 要素の中に表示されます。

<form oninput="result.value=parseInt(a.value)+parseInt(b.value)">
  <input type="range" id="b" name="b" value="50" /> +
  <input type="number" id="a" name="a" value="10" /> =
  <output name="result" for="a b">60</output>
</form>

アクセシビリティの考慮

多くのブラウザーでは、この要素を aria-live 領域として実装しています。これにより、支援技術は、その中に投稿された UI インタラクションの結果を発表しますが、その結果を生成するコントロールからフォーカスを外す必要はありません。

仕様書

仕様書 状態 備考
HTML Living Standard
<output> の定義		 現行の標準
HTML5
<output> の定義		 勧告

ブラウザーの互換性

BCD tables only load in the browser