JS получить значение input

В данном уроке мы рассмотрим способы, с помощью которых можно получить значение инпута через JavaScript. Пусть у нас есть следующий инпут:

<input value="text">

Получим ссылку на этот инпут с помощью метода querySelector:

let input = document.querySelector('input');

Расмотрим различные варианты получения значения инпута.

Вариант 1

Получим и выведем значение инпута:

let value = input.value;
console.log(value);

Сделаем так, чтобы значение инпута вывелось по потери фокуса.

Для этого навесим на инпут обработчик потери фокуса:

input.addEventListener('blur', function() {
	
});

А теперь по потери фокуса получим и выведем значение инпута:

input.addEventListener('blur', function() {
	let value = this.value;
	console.log(value);
});