Web/API/HTMLButtonElement

From Get docs


The HTMLButtonElement interface provides properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <button> elements.

Properties

Inherits properties from its parent, HTMLElement.

HTMLButtonElement.accessKey
Is a DOMString indicating the single-character keyboard key to give access to the button.
HTMLButtonElement.autofocus
Is a Boolean indicating whether or not the control should have input focus when the page loads, unless the user overrides it, for example by typing in a different control. Only one form-associated element in a document can have this attribute specified.
HTMLButtonElement.disabled
Is a Boolean indicating whether or not the control is disabled, meaning that it does not accept any clicks.
HTMLButtonElement.form Read only
Is a HTMLFormElement reflecting the form that this button is associated with. If the button is a descendant of a form element, then this attribute is the ID of that form element. If the button is not a descendant of a form element, then the attribute can be the ID of any form element in the same document it is related to, or the null value if none matches.
HTMLButtonElement.formAction
Is a DOMString reflecting the URI of a resource that processes information submitted by the button. If specified, this attribute overrides the action attribute of the <form> element that owns this element.
HTMLButtonElement.formEnctype
Is a DOMString reflecting the type of content that is used to submit the form to the server. If specified, this attribute overrides the enctype attribute of the <form> element that owns this element.
HTMLButtonElement.formMethod
Is a DOMString reflecting the HTTP method that the browser uses to submit the form. If specified, this attribute overrides the method attribute of the <form> element that owns this element.
HTMLButtonElement.formNoValidate
Is a Boolean indicating that the form is not to be validated when it is submitted. If specified, this attribute overrides the novalidate attribute of the <form> element that owns this element.
HTMLButtonElement.formTarget
Is a DOMString reflecting a name or keyword indicating where to display the response that is received after submitting the form. If specified, this attribute overrides the target attribute of the <form> element that owns this element.
HTMLButtonElement.labels Read only
Is a NodeList that represents a list of <label> elements that are labels for this button.
HTMLButtonElement.menu '
Is a HTMLMenuElement representing the menu element to be displayed if the button is clicked and is of type="menu".
HTMLButtonElement.name
Is a DOMString representing the name of the object when submitted with a form. HTML5 If specified, it must not be the empty string.
HTMLButtonElement.tabIndex
Is a long that represents this element's position in the tabbing order.
HTMLButtonElement.type
Is a DOMString indicating the behavior of the button. This is an enumerated attribute with the following possible values:
submit
  • The button submits the form. This is the default value if the attribute is not specified, HTML5 or if it is dynamically changed to an empty or invalid value.
  • reset: The button resets the form.
  • button: The button does nothing.
  • menu: The button displays a menu. '
HTMLButtonElement.willValidate Read only
Is a Boolean indicating whether the button is a candidate for constraint validation. It is false if any conditions bar it from constraint validation, including: its type property is reset or button; it has a <datalist> ancestor; or the disabled property is set to true.
HTMLButtonElement.validationMessage Read only
Is a DOMString representing the localized message that describes the validation constraints that the control does not satisfy (if any). This attribute is the empty string if the control is not a candidate for constraint validation (willValidate is false), or it satisfies its constraints.
HTMLButtonElement.validity Read only
Is a ValidityState representing the validity states that this button is in.
HTMLButtonElement.value
Is a DOMString representing the current form control value of the button.

Methods

Inherits methods from its parent, HTMLElement

Name Return Type Description
checkValidity() Boolean Not supported for reset or button elements.
reportValidity() Boolean Not supported for reset or button elements.
setCustomValidity(in DOMString error) void Not supported for reset or button elements.

With Gecko-based browser, use the :-moz-submit-invalid pseudo-class to style submit buttons based on the validation of a form.

Specifications

Specification Status Comment
HTML Living StandardThe definition of 'HTMLButtonElement' in that specification. Living Standard
HTML 5.2The definition of 'HTMLButtonElement' in that specification. Recommendation The menu attribute and type="menu" value have been removed.
HTML 5.1The definition of 'HTMLButtonElement' in that specification. Recommendation The following attribute has been added: menu.

The type attribute can take one more value, "menu".

HTML5The definition of 'HTMLButtonElement' in that specification. Recommendation The attributes tabindex and accesskey, are now defined on HTMLElement.

The following attributes have been added: autofocus, formAction, formEnctype, formMethod, formNoValidate, formTarget, labels, validity, validationMessage, and willValidate. The following methods have been added: checkValidity(), setCustomValidity(). The type attribute is no more read-only.

Document Object Model (DOM) Level 2 HTML SpecificationThe definition of 'HTMLButtonElement' in that specification. Obsolete No change from Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 SpecificationThe definition of 'HTMLButtonElement' in that specification. Obsolete 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
HTMLButtonElement Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

accessKey Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

autofocus Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

disabled Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

form Chrome

Full support Yes

Edge

Full support 16

Firefox

Full support 4

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 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

formAction Chrome

Full support Yes

Edge

Full support 12

Firefox Full support 4

Notes'

Full support 4

Notes'

Notes' In Firefox 56, the implementation has been updated so that the formAction property returns the correct form submission URL, as per spec, when the associated button is being used to submit a form (bug 1366361).

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android Full support 4

Notes'

Full support 4

Notes'

Notes' In Firefox 56, the implementation has been updated so that the formAction property returns the correct form submission URL, as per spec, when the associated button is being used to submit a form (bug 1366361).

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

formEnctype Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 4

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

formMethod Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 4

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

formNoValidate Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 4

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

formTarget Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 4

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

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

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

menu

Experimental'

Chrome

No support No

Edge

No support No

Firefox

No support No

IE

No support No

Opera

No support No

Safari

No support No

WebView Android

No support No

Chrome Android

No support No

Firefox Android

No support No

Opera Android

No support No

Safari iOS

No support No

Samsung Internet Android

No support No

name Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

reportValidity Chrome

Full support 40

Edge

Full support 17

Firefox

Full support 49

IE

No support No

Opera

Full support 27

Safari

Full support 10

WebView Android

Full support 40

Chrome Android

Full support 40

Firefox Android

Full support 64

Opera Android

Full support 27

Safari iOS

Full support 10

Samsung Internet Android

Full support 4.0

tabIndex Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

type Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

validationMessage Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

validity Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

value Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

willValidate Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support 1

IE

Full support Yes

Opera

Full support Yes

Safari

Full support Yes

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support 4

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

Legend

Full support  
Full support
No support  
No support
Experimental. Expect behavior to change in the future.'
Experimental. Expect behavior to change in the future.
See implementation notes.'
See implementation notes.


See also

  • HTML element implementing this interface: <button>