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

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

html<input value="text">

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

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

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

Вариант 1

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

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

Вариант 2

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

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

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

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

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