The Button object represents an HTML <button> element.
We can access a <button> element by using getElementById().
<!DOCTYPE html>
<html>
<body>
<button type="button" id="myBtn" onclick="myFunction()">test</button>
<p id="demo"></p>
<script>
function myFunction() {<!-- www.j av a 2 s. co m-->
var x = document.getElementById("myBtn");
x.disabled = true;
}
</script>
</body>
</html>
The code above is rendered as follows:
We can create a <button> element by using the document.createElement() method.
<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">test</button>
<script>
function myFunction() {<!--from www .j av a 2 s. c o m-->
var x = document.createElement("BUTTON");
var t = document.createTextNode("Click me");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
</body>
</html>
The code above is rendered as follows:
| Property | Description |
|---|---|
| autofocus | Sets or gets whether a button can auto focus when the page loads |
| disabled | Disable or enable a button |
| form | Get the form that contains a button |
| formAction | Sets or gets the formaction attribute of a button |
| formEnctype | Sets or gets the formenctype attribute of a button |
| formMethod | Sets or gets the formmethod attribute of a button |
| formNoValidate | Sets or gets whether the form-data should be validated, on submission |
| formTarget | Sets or gets the formtarget attribute of a button |
| name | Sets or gets the name attribute of a button |
| type | Sets or gets the type of a button |
| value | Sets or gets the value attribute of a button |
The Button object supports the standard properties and events.