Web Tools Table Maker3schools TranslateImage CompressorFavicon Icon GeneratorCrop & Resize Image
Apu
Apu April 24, 2023 › #HowTo #Input

How to display value of textbox in JavaScript

To display the value of a textbox in JavaScript, you can use the value property of the textbox element. Here is an example of how to display the value of a textbox using JavaScript.

<input type="text" id="my-textarea" placeholder="Type Your Name">
<button onclick="myFunction()">Submit</button>
<script>
function myFunction(){
 const textboxValue = document.getElementById("my-textarea").value;
 console.log(textboxValue);
}
</script>

In the above example, we created a textbox element with an id attribute and set its value to my-textarea.

So that we can use "my-textarea" in our JavaScript code to reference the textbox element and access its value property.

Then, we use the getElementById() method to get a reference to the textbox element, and then access its value property to get the text entered by the user. We then use console.log to display the value in the browser console.

If you want to display the textbox value in the HTML content, you can use the innerHTML property to set the content of an HTML element.

<input type="text" id="my-textarea" placeholder="Type Your Name">
<button onclick="myFunction()">Submit</button>
<p id="html-element"></p>
<script>
function myFunction(){
 const textboxValue = document.getElementById("my-textarea").value;
 document.getElementById("html-element").innerHTML = textboxValue;
}
</script>

In the above example, we use the getElementById method to get a reference to an HTML element where we want to display the textbox value, and then set its innerHTML property to the textbox value we retrieved earlier.

save
listen
AI Answer
Write Your Answer
loading
back
View All