单击时更改按钮类型上的文本

Question

I can't change the text of a button when the button type is button, but I can change it if the type is input

The code for the button is

<button type='button'
        id='1'
        name='4'
        class='btn btn-select'>Text I want to change</button>

In the handler I am trying to change it like so:

document.getElementById("1").value="New Button Text";

If I change it input type it works? Why?

Answer 1

The label for a <input type="button"> is determined by the value attribute. An <input type="submit"> gets its label and submitted data from the value attribute (they can't be different).

The label for a <button> element is determined by its text content . The value attribute determines what data it will submit to the server (if it were a submit button) when clicked. They can be different.

 document.getElementById("1").textContent = "New Button Text";

 <button type='button' id='1' name='4' class='btn btn-select'>Text I want to change</button>

Answer 2

TRY:

document.getElementById("1").innerText="New Button Text";

you are use the button as a tag not as input field