HTML <output> Tag

The <output> element is new in HTML5 and represents a result for a calculation.

The <output> element is used in forms.

This tag can be defined under the <input> tag.

Syntax

The <output> element comes in pairs. Which means that the content must be written between opening (<output>) and closing (</output>) elements.

Example

<!DOCTYPE html>
<html>
   <body>
      <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
         <input type="range" id="a" value="50">100 +
         <input type="number" id="b" value="25"> =
         <output name="x" for="a b"></output>
      </form>
   </body>
</html>

In the given example number input type and parseInt JavaScript function are used to convert the input strings to integers.

Result

Attributes:

Attributes Value Description
for element_id Defines the relation between calculation result and the elements which are used in the calculation.
form form_id Defines one or more forms which the output element belongs to.
name name Defines a name for the output element.

The <output> element also uses the Global Attributes.
Prev
Next