Cannot change button text in HTML and JavaScript.

I am trying to change the button text with this code, but I am not getting any response. It should be good looking at everything I read, but that does not change the text. What am I doing wrong here?

<!DOCTYPE html> <html> <head> <script> function changeText() { document.getElementById('myButton').value = "New value"; } </script> </head> <body> <button id="myButton" onclick="changeText()">Change my text!</button> </body> </html> 
+5
source share
2 answers

Instead, you need to set the innerHTML 'property:

 function changeText() { document.getElementById('myButton').innerHTML= "New value"; } 

You can specify a value on the button, but it is not used very often. In your case, you want to change the button text. So innnerHTML is your friend. See this page for more details.

Also note that you can also use "innerText" in IE, but it is not supported in Firefox (and probably not in some others). "textContent" may also be an option, but that is not supported in older browsers (until 2011). Thus, innerHTML is the safest option.

+7
source

Buttons can make a difference, but what is displayed is the HTML inside the button that you want to change. Better use innerHTML:

 function changeText() { document.getElementById('myButton').innerHTML = "New value"; } 
+3
source

Source: https://habr.com/ru/post/1233875/


All Articles