HTML

HTMLButtonElement

HTMLButtonElement <button>

In addition to the ordinary HTMLElement interface, which is also made available to it by inheritance, the HTMLButtonElement interface has properties and methods for working with <button> elements. A clickable button is defined by the <button> tag. You can add text (as well as tags like <i> ,<b>, <strong>,<br>,<img>, etc.) inside of a <button> element. With a button made with the <input> element, that is not allowed!

Attribute Value Description Example
autofocus autofocus Specifies that a button should automatically get focus when the page loads <button type="button" autofocus>Click Me!</button>
disabled disabled Specifies that a button should be disabled <head> <base target="_blank"> </head>
form form_id Specifies which form the button belongs to <form action="/action_page.php" method="get" id="form1"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"> </form> <button type="submit" form="form1" value="Submit">Submit</button>
formaction URL Specifies where to send the form-data when a form is submitted. Only for type="submit" <form action="/action_page.php" method="get"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"><br><br> <button type="submit">Submit</button> <button type="submit" formaction="/action_page2.php">Submit to another page</button> </form>
formenctype application/x-www-form-urlencoded Specifies how form-data should be encoded before sending it to a server. Only for type="submit" <form action="/action_page_binary.asp" method="post"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname" value="Ståle"><br><br> <button type="submit">Submit with character encoding</button> <button type="submit" formenctype="text/plain">Submit without character encoding</button> </form>
multipart/form-data
text/plain
formmethod get Specifies how to send the form-data (which HTTP method to use). Only for type="submit" <form action="/action_page.php" method="get"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"><br><br> <button type="submit">Submit</button> <button type="submit" formmethod="post">Submit using POST</button> </form>
post
formnovalidate formnovalidate Specifies that the form-data should not be validated on submission. Only for type="submit" <form action="/action_page.php" method="get"> <label for="email">Enter your email:</label> <input type="email" id="email" name="email"><br><br> <button type="submit">Submit</button> <button type="submit" formnovalidate>Submit without validation</button> </form>
formtarget _blank Specifies where to display the response after submitting the form. Only for type="submit" <form action="/action_page.php" method="get"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"><br><br> <button type="submit" >Submit</button> <button type="submit" formtarget="_blank">Submit to a new window</button> </form>
_self
_parent
_top
framename
name name Specifies a name for the button <form action="/action_page.php" method="get"> Choose your favorite subject: <button name="subject" type="submit" value="HTML">HTML</button> <button name="subject" type="submit" value="CSS">CSS</button> </form>
type button Specifies the type of button <form action="/action_page.php" method="get"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"><br><br> <button type="submit" value="Submit">Submit</button> <button type="reset" value="Reset">Reset</button> </form>
reset
submit
value text Specifies an initial value for the button <form action="/action_page.php" method="get"> Choose your favorite subject: <button name="subject" type="submit" value="fav_HTML">HTML</button> <button name="subject" type="submit" value="fav_CSS">CSS</button> </form>

Browser Compatibility

Element Chrome Edge Firefox Safari Opera
<button> Yes Yes Yes Yes Yes