Как правильно прочитать число из поля ввода

Как получить значение поля input с помощью JavaScript

Вы можете просто использовать свойство value элемента input DOM, чтобы получить значение поля ввода текста.

В следующем примере введенный текст будет отображаться в поле ввода при нажатии кнопки с использованием JavaScript.

       Get Value   

Читайте также

Похожие примеры:

• Как получить значение текстового поля в jQuery
• Как получить выбранное имя файла из файла типа ввода с помощью jQuery
• Как проверить наличие пустой строки в JavaScript

Получаем данные из поля ввода с помощью input.value

Мы научились с помощью скрипта изменять текст на странице, когда пользователь отправляет форму. У нас это форма подписки на рассылку, и нам нужно сообщить пользователю, что он успешно подписался. Сообщение будет выглядеть так:

Адрес e-mail добавлен в список получателей рассылки.

Адрес электронной почты в сообщении должен быть тем, который введёт пользователь. Как его получить?

Нам поможет особое свойство, которое есть у полей ввода, — value . Допустим, на странице есть поле ввода input :

Босс проходил мимо и ввёл туда своё имя — Кекс. С помощью свойства value мы можем получить данные из этого поля ввода. А после, например, вывести их в консоль:

let input = document.querySelector('input'); console.log(input.value); // Выведет: Кекс

А ещё мы можем вывести данные из поля ввода прямо на страницу. Представим, что у нас на странице есть абзац, который мы нашли и сохранили в переменную paragraph . Мы можем сделать так:

paragraph.textContent = input.value;

И теперь то, что ввёл пользователь в поле input , отобразится на странице как текстовое содержимое элемента paragraph .

В нашем случае пользователь вводит свой адрес в поле с классом subscription-email . Найдём его и скажем JavaScript вывести полученные данные на страницу.

Почему бы не прочитать текст из поля ввода с помощью textContent ? Если мы попытаемся это сделать, то получим пустую строку. Для JavaScript поля формы не имеют текстового содержимого, их значения хранятся именно в value .

Записывайтесь на трансляцию 17 января в 13:00

Перейти к заданию

• index.html Сплит-режим
• style.css Сплит-режим
• script.js Сплит-режим