You want to get the value of a text input field using JavaScript. How do you do this?
Get the <input>
element using one of the methods on the document
interface that returns a DOM Element
, such as getElementById
. You can then get the element’s value using the value
property. The example code below shows HTML and JavaScript code for an <input>
element with a button to get the value of the input:
<label for="name">Name:</label>
<input
type="text"
id="name"
name="name"
required
/>
<button id="input-btn" type="button">
Get input value
</button>
const inputBtn = document.getElementById("input-btn");
const inputEl = document.getElementById("name");
function getInputVal() {
console.log(inputEl.value);
}
inputBtn.addEventListener("click", getInputVal);
A "click"
event listener is added to the button to get the value of the input when the button is clicked.