最終更新日 ![]()
output要素は、計算の結果を示します。テキストコンテンツとして初期値を含めることができます。
for属性では、計算に使われる値または計算に影響される値と、計算結果の値を明示的に関連付けることができます。同じドキュメント内の要素でoutput要素の計算結果と関連付けたい要素のid属性の値を、スペースで区切って複数指定できます。
output要素は、Phrasingコンテンツの記述箇所で使用できます。
output要素に対応していないブラウザのユーザーのためにも、テキストコンテンツなどで計算内容を示しておくとよいでしょう。
| カテゴリ | タグの省略 | 親要素 | 子要素 |
|---|---|---|---|
|
Flowコンテンツ Phrasingコンテンツ フォーム関連要素 |
省略不可 | Phrasingコンテンツを子にできる要素 | Phrasingコンテンツ |
| 属性 | 値 | 説明 |
|---|---|---|
| for | ID | 計算に使われる要素のid属性の値を指定します。 |
| form | ID | form要素のid属性の値を指定します。 |
| name | 文字列 | output要素の名前を指定します。 |
| グローバル属性 | - | - |
| イベント属性 | - | - |
<body>
<form oninput="piece.value = total.valueAsNumber / items.valueAsNumber">
<p>ハンバーガーの単価を計算します。</p>
<p>合計金額:<input type="number" name="total"></p>
<p>個数:<input type="number" name="items"></p>
<p>単価:<output name="piece"></output></p>
</form>
</body>