Атрибут value
Атрибут value задает значение по умолчанию для поля ввода HTML формы. Оно будет автоматически вставлено в него при заходе на страницу.
Применяется к тегам input , option и другим.
Текстовый инпут
В случае текстового поля ввода input содержимое атрибута value будет задавать видимый в поле текст по умолчанию (его можно будет удалить и написать свой).
Кнопка
В случае, если атрибут применяется к кнопке, созданной через тег input с атрибутом type в значениях button, submit или reset, атрибут value будет задавать текст кнопке.
Чекбокс
В случае, если атрибут применяется к чекбоксу внешних изменений наблюдаться не будет, но отмеченный чекбокс будет посылать на сервер содержимое этого атрибута. Если атрибута value у чекбокса нет — он будет посылать строку ‘on’ . Если чекбокс не отмечен — ничего не будет присылаться на сервер не зависимо от наличия атрибута value .
Радио переключатель
Для группы радио переключателей необходимо задавать разные значения атрибута value , чтобы после отправки на сервер, PHP мог определить, какой из переключателей был выбран.
Тег option
В случае, если тегу option не задан атрибут value , то на сервер будет отправляться содержимое тега option (то, что между открывающим). Если же атрибут задан — будет отправлено его содержимое.
Пример
Давайте полю ввода установим текст по умолчанию:
Object.values()
Метод Object.values() возвращает массив значений перечисляемых свойств объекта в том же порядке что и цикл for. in . Разница между циклом и методом в том, что цикл перечисляет свойства и из цепочки прототипов.
Интерактивный пример
Синтаксис
Object.values(obj)
Параметры
Объект, чьи значения перечисляемых свойств будут возвращены.
Возвращаемое значение
Массив содержащий значения перечисляемых свойств объекта.
Описание
Object.values() возвращает массив, чьи элементы это значения перечисляемых свойств найденных в объекте. Порядок такой же как если пройтись по объекту циклом вручную.
Примеры
var obj = foo: "bar", baz: 42 >; console.log(Object.values(obj)); // ['bar', 42] // Массив как объект var obj = 0: "a", 1: "b", 2: "c" >; console.log(Object.values(obj)); // ['a', 'b', 'c'] // Массив как объект со случайным порядком ключей // Когда мы используем нумерованные ключ, значения возвращаются в порядке возрастания var an_obj = 100: "a", 2: "b", 7: "c" >; console.log(Object.values(an_obj)); // ['b', 'c', 'a'] // getFoo неперечисляемое свойство var my_obj = Object.create( >, getFoo: value: function () return this.foo; >, >, >, ); my_obj.foo = "bar"; console.log(Object.values(my_obj)); // ['bar'] // Аргумент, не являющийся объектом, будет приведён к объекту console.log(Object.values("foo")); // ['f', 'o', 'o']
Полифил
Для добавления совместимости Object.values со старым окружением, которое не поддерживает нативно его, вы можете найти полифил здесь tc39/proposal-object-values-entries или в es-shims/Object.values репозитории.
Спецификации
| Specification |
|---|
| ECMAScript Language Specification # sec-object.values |
Совместимость с браузерами
BCD tables only load in the browser
Смотрите также
- Перечисляемость и принадлежность свойств
- Object.keys()
- Object.entries() Экспериментальная возможность
- Object.prototype.propertyIsEnumerable()
- Object.create()
- Object.getOwnPropertyNames()
Found a content problem with this page?
- Edit the page on GitHub.
- Report the content issue.
- View the source on GitHub.
This page was last modified on 7 авг. 2023 г. by MDN contributors.
Your blueprint for a better internet.
Атрибут value HTML тега input
Атрибут value определяет значение для элемента ввода.
Для разных типов элементов ввода атрибут value используется по разному:
- для типов «button«, «reset«, «submit» — он определяет текст на кнопке
- для типов «text«, «password«, «hidden» — он определяет начальное значение поля ввода
- для типов «checkbox«, «radio«, «image» — он определяет значение, ассоциированное с элементом ввода (также это значение, отправляемое на сервер)
Атрибут value является обязательным для и .
Нельзя использовать атрибут value с .
Синтаксис атрибута
Значения атрибута
| Значение | Описание |
|---|---|
| значение | Начальное значение элемента ввода |
Пример использования атрибута
HTML форма со значениями по умолчанию:
Получаем данные из поля ввода с помощью 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 .
Хотите начать карьеру веб-разработчика? Записывайтесь на профессию «Фронтенд-разработчик», которая стартует 12 декабря 2023. Всего от 4 130 ₽ в месяц.
Перейти к заданию
- index.html Сплит-режим
- style.css Сплит-режим
- script.js Сплит-режим
