[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/HTML/Reference/Elements/output [Back]  [Original]

<output> - HTML | MDN

MDN Web Docs

View in English Always switch to English

<output>

Baseline

201810

<output> HTML

for

id

form

() <form> <form> id <output> <form>

<output> <form> <form> <form> <output>

name

form.elements API

<output>

aria-live UI

0 100 2 <input> 2 <output>

html
<form id="example-form">
  <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>
js
const form = document.getElementById("example-form");
const a = form.elements["a"];
const b = form.elements["b"];
const result = form.elements["result"];

function updateResult() {
  const aValue = a.valueAsNumber;
  const bValue = b.valueAsNumber;
  result.value = aValue + bValue;
}

form.addEventListener("input", updateResult);

updateResult();

ARIA status
ARIA
DOM HTMLOutputElement

HTML
# the-output-element


Web Proxy Viewer  |  New URL  |  Original Page