HTML <output> Tag
To display the result of a certain calculation or the outcome of a user action the HTML <output> tag is used. It was introduced in HTML5.
Syntax:
<output>......</output>
Example:
<!DOCTYPE html> <html> <body> <form oninput="z.value=parseInt(x.value)+parseInt(y.value)"> <label>First Value:</label><br><br> <input type="number" id="y" value="100"><br><br>+<br><br> <label>Second Value:</label><br><br> 0<input type="range" id="x" value="100">100 <br><br>=<br><br> <label>Output:</label> <output name="z" for="x y"></output> </form> </body> </html>
Explanation:
In the above example, we are using the <output> tag to display the result of the addition of two numbers.
Tag-specific attributes:
Attribute | Value | Uses |
for | element_id | Used to define the relationship between the result of the calculation and the input elements. |
form | form_id | Used to define the form or forms to which the output element is associated with. |
name | name | Used to add a name for the output element. |
Global attributes:
The HTML global attributes are supported by the HTML <output> tag.
Event attributes:
The HTML event attributes are supported by the HTML <output> tag.
Supporting Browsers:
Chrome, IE, Firefox, Opera, and Safari.