HTML DOM Button value Property
The Button value Property is used to set or return the value of the value attribute of a button element. The value attribute for <button> element in HTML is used to specify the initial value of the button element.
Syntax:
- It is used to return the value property.
buttonObject.value
- It is used to set the value property.
buttonObject.value = text
Property Values:
- text: It specify the initial value of the Button.
Return Value: It returns a string value which represent the initial value of the button.
Example 1: This example illustrates how to return the value Property.
HTML
<!DOCTYPE html> < html > < head > < title > HTML DOM button value Property </ title > </ head > < body style = "text-align:center" > < h1 >w3wiki</ h1 > < h2 > HTML DOM button value Property </ h2 > < button id = "btn" value = "w3wiki" onclick = "myBeginner()" > Click Here! </ button > < p id = "result" ></ p > < script > function myBeginner() { let x = document.getElementById("btn").value; document.getElementById("result").innerHTML = x; } </ script > </ body > </ html > |
Output:
Example 2: This example illustrates how to set the value Property.
HTML
<!DOCTYPE html> < html > < head > < title > HTML DOM button value Property </ title > </ head > < body style = "text-align:center" > < h1 >w3wiki</ h1 > < h2 > HTML DOM button value Property </ h2 > < button id = "btn" value = "User" onclick = "myBeginner()" > Click Here </ button > < p id = "result" ></ p > < script > function myBeginner() { let x = document.getElementById("btn").value = "w3wiki" document.getElementById("result").innerHTML = "The value changed from User to " + x; } </ script > </ body > </ html > |
Output:
Supported Browsers:
- Google Chrome
- Edge 12 and above
- Internet Explorer
- Firefox
- Opera
- Safari
Contact Us