Кратко
СкопированоАтрибут value
можно использовать для разных тегов:
У разных тегов атрибут отвечает за разные функции.
Пример
СкопированоВ примере ниже нумерация элементов списка начнётся с 5:
<ol> <li value="5">Номер 5</li> <li>Номер 6</li> <li>Номер 7</li></ol>
<ol> <li value="5">Номер 5</li> <li>Номер 6</li> <li>Номер 7</li> </ol>
А в этом примере в поле ввода уже будет написано «Дока»:
<form> <label> Название лучшего справочника по вебу: <input type="text" value="Дока"> </label> <button type="submit">Соглашусь!</button></form>
<form> <label> Название лучшего справочника по вебу: <input type="text" value="Дока"> </label> <button type="submit">Соглашусь!</button> </form>
Как пишется
Скопировано<button>
Если указать у кнопки атрибут value
с каким-то значением, то это значение будет передано на сервер в момент отправки данных из формы. На сервер передаётся пара «имя=значение». Имя кнопки можно задать атрибутом name
.
В примере ниже вместе с данными формы на сервер отправится информация «diversion=Нет!»:
<form> <label> Соглашаетесь с нашими правилами? <input type="checkbox" name="agreement"> </label> <button type="submit" value="Нет!" name="diversion">Соглашаюсь</button></form>
<form> <label> Соглашаетесь с нашими правилами? <input type="checkbox" name="agreement"> </label> <button type="submit" value="Нет!" name="diversion">Соглашаюсь</button> </form>
<option>
СкопированоЕсли выбран какой-то пункт списка, то при отправке формы на сервер будет передано значение атрибута value
этого пункта. Если атрибут не задан, то при отправке будет использоваться текстовое содержимое тега <option>
.
<data>
СкопированоДля тега <data>
атрибут value
является обязательным. В нём указывается понятная для компьютера информация.
Например, в интернет-магазине у каждого товара есть идентификатор. Можно указать его в качестве значения атрибута value
:
<ul> <li> <data value="item001">Модный телефон</data> </li> <li> <data value="item002">Нужный компьютер</data> </li> <li> <data value="item003">Классный телефон</data> </li> <li> <data value="item004">Удобный телефон</data> </li> <li> <data value="item005">Нормальный телефон</data> </li></ul>
<ul> <li> <data value="item001">Модный телефон</data> </li> <li> <data value="item002">Нужный компьютер</data> </li> <li> <data value="item003">Классный телефон</data> </li> <li> <data value="item004">Удобный телефон</data> </li> <li> <data value="item005">Нормальный телефон</data> </li> </ul>
<input>
СкопированоАтрибут value
задаёт значение по умолчанию для поля ввода. Это значение будет передано на сервер в момент отправки формы. Поскольку у тега <input>
большой список разных типов, то и атрибут в каждом конкретном случае имеет своё значение:
- Для инпутов с типами
button
,reset
, иsubmit
задаёт текст на кнопке. - Для типов
text
,password
, иhidden
задаёт начальное значение. В первых двух случаях пользователь сможет стереть его и написать что-то своё. - Для типов
checkbox
,radio
, иimage
— задаёт отправляемое на сервер значение, которое пользователь поменять не может.
Атрибут value
можно задать для инпута любого типа, кроме file
.
<li>
СкопированоАтрибут value
можно применить к пунктам нумерованного списка (<ol>
). Значение атрибута установит начало отсчёта для автоматического счётчика. Значение должно быть целым положительным числом.
<ol> <li value="5">Номер 5</li> <li>Номер 6</li> <li>Номер 7</li></ol>
<ol> <li value="5">Номер 5</li> <li>Номер 6</li> <li>Номер 7</li> </ol>
<meter>
СкопированоАтрибут value
определяет текущее значение элемента. Обязательно должно быть числом. Если атрибут не задан, то текущее значение равно 0.
<meter max="100" min="0" value="50"></meter>
<meter max="100" min="0" value="50"></meter>
<progress>
СкопированоПоскольку тег <progress>
показывает процесс выполнения какого-то действия, то атрибут value
в данном случае показывает, сколько от задачи выполнено в данный момент. Значение должно быть числом.
<progress id="file" max="100" value="70">70%</progress>
<progress id="file" max="100" value="70">70%</progress>