Web/API/HTMLOutputElement

From Get docs


The HTMLOutputElement interface provides properties and methods (beyond those inherited from HTMLElement) for manipulating the layout and presentation of <output> elements.

Properties

This interface also inherits properties from its parent, HTMLElement.

HTMLOutputElement.defaultValue
A DOMString representing the default value of the element, initially the empty string.
HTMLOutputElement.formRead only
An HTMLFormElement indicating the form associated with the control, reflecting the form HTML attribute if it is defined.
HTMLOutputElement.htmlForRead only
A DOMTokenList reflecting the for HTML attribute, containing a list of IDs of other elements in the same document that contribute to (or otherwise affect) the calculated value.
HTMLOutputElement.labelsRead only
A NodeList of <label> elements associated with the element.
HTMLOutputElement.name
A DOMString reflecting the name HTML attribute, containing the name for the control that is submitted with form data.
HTMLOutputElement.typeRead only
The DOMString "output".
HTMLOutputElement.validationMessageRead only
A DOMString representing a localized message that describes the validation constraints that the control does not satisfy (if any). This is the empty string if the control is not a candidate for constraint validation (willValidate is false), or it satisfies its constraints.
HTMLOutputElement.validityRead only
A ValidityState representing the validity states that this element is in.
HTMLOutputElement.value
A DOMString representing the value of the contents of the elements. Behaves like the Node.textContent property.
HTMLOutputElement.willValidateRead only
A Boolean indicating whether the element is a candidate for constraint validation.

Methods

This interface also inherits methods from its parent, HTMLElement.

HTMLOutputElement.checkValidity()
Checks the validity of the element and returns a Boolean holding the check result.
HTMLOutputElement.reportValidity()
This method reports the problems with the constraints on the element, if any, to the user. If there are problems, fires an invalid event at the element, and returns false; if there are no problems, it returns true.
When the problem is reported, the user agent may focus the element and change the scrolling position of the document or perform some other action that brings the element to the user's attention. User agents may report more than one constraint violation if this element suffers from multiple problems at once. If the element is not rendered, then the user agent may report the error for the running script instead of notifying the user.
HTMLOutputElement.setCustomValidity()
Sets a custom validity message for the element. If this message is not the empty string, then the element is suffering from a custom validity error, and does not validate.

Modes

This element behaves in one of two modes: default mode and value mode.

Default mode

Initially, the element is in default mode, and so the contents of the element represent both the value of the element and its default value.

If the element is in default mode when the descendants of the element are changed in any way, the defaultValue property is set to the value of the textContent property.

Resetting the form puts the element into default mode, and sets the textContent property to the value of the defaultValue property.

Value mode

The element goes into value mode when the contents of the value property are set. The value property otherwise behaves like the textContent property. When the element is in value mode, the default value is accessible only through the defaultValue property.

Specifications

Specification Status Comment
HTML Living StandardThe definition of 'HTMLOutputElement' in that specification. Living Standard
HTML 5.1The definition of 'HTMLOutputElement' in that specification. Recommendation No change
HTML5The definition of 'HTMLOutputElement' in that specification. Recommendation Initial definition

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
HTMLOutputElement Chrome

Full support Yes

Edge

Full support ≤18

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

checkValidity Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

defaultValue Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

form Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

htmlFor

Chrome Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Chrome 50, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Opera 37, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

Safari

Full support 5

WebView Android Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Chrome 50, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

Chrome Android Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Chrome 50, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

Firefox Android

Full support 4

Opera Android Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Opera 37, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

Safari iOS

No support No

Samsung Internet Android Full support Yes

Notes'

Full support Yes

Notes'

Notes' Before Samsung Internet 5.0, this property returned the deprecated child DOMSettableTokenList instead of DOMTokenList.

labels Chrome

Full support Yes

Edge

Full support 18

Firefox

Full support 56

IE

No support No

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 56

Opera Android

?

Safari iOS

No support No

Samsung Internet Android

Full support Yes

name Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

reportValidity Chrome

Full support 40

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support 27

Safari

Full support 5

WebView Android

Full support 40

Chrome Android

Full support 40

Firefox Android

Full support 4

Opera Android

Full support 27

Safari iOS

No support No

Samsung Internet Android

Full support 4.0

setCustomValidity Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

type Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

validationMessage Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

validity Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

value Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

willValidate Chrome

Full support Yes

Edge

Full support 14

Firefox

Full support 4

IE

No support No

Opera

Full support Yes

Safari

Full support 5

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

No support No

Samsung Internet Android

Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.'
See implementation notes.


See also

  • The HTML element implementing this interface: <output>.