Атрибут name тега | HTML справочник
HTML тег <meta>Значение и применение
Атрибут name (HTML тега <meta>) определяет имя документа на уровне метаданных. Имя метаданных указывается в атрибуте name, а значение указывается в атрибуте content.
Если атрибут http-equiv используется, то атрибут name не должен устанавливаться в мета-теге.
Поддержка браузерами
Синтаксис:
<meta name = "value">
Значения атрибута
| Значение | Описание |
|---|---|
| application-name | Указывает имя веб-приложения, которое запущено на этой странице. Браузеры могут использовать эту информацию для идентификации приложения. |
| author | Указывает имя автора документа. |
| description | Задает описание для страницы. Это описание могут использовать поисковые машины для отображения результатов поиска. |
| generator | Указывает один из программных пакетов, который использовался для создания этого документа (как правило подобные мета-теги формируются автоматически, если используется какой-либо конструтор создания сайтов). |
| keywords | Задает разделенный запятыми список ключевых слов. Ключевые слова могут использоваться некотрыми поисковыми машинами. |
На этой странице перечислены прочие допустимые значения (расширения) атрибута name тега <meta>: MetaExtensions.
При необходимости предусмотрена возможность добавить значения к этому списку, что cделает их имена юридически закрепленными за стандартом метаданных HTML5 (изменения в данном реестре не будут отражены в валидаторах в режиме реального времени, но обновятся в течении одной недели или около того).
Часто используемые значения атрибута
Рассмотрим часто используемые варианты использования тега <meta>:
<meta name = "description" content = "Бесплатные уроки по созданию сайтов" >
Описание в данном теге довольно важное, его учитывают поисковые машины при индексации. Атрибут content в данном примере содержит описание конкретной веб-страницы сайта. Не рекомендуется использовать длинные описания.
<meta name = "keywords" content = "HTML, CSS, JavaScript">
Представляет собой список ключевых слов (касающиеся конкретной страницы). Ходит много споров о том учитывается или нет поисковыми системами это значение, исходя из перечня, используемых метатегов в Google, то он не учитывает этот мета тег, а Яндекс, в некоторых случаях оставляет за собой право его использовать.
Определяет автора контента:
<meta name = "author" content = "Denis Bolshakov">
Индексация страниц
Используется поисковыми системами при индексации страниц:
<meta name = "robots" content = "noindex, follow">
Доступные значения:
| Значение атрибута | Определение |
|---|---|
| noindex | запрещает индексирование документа. |
| nofollow | запрещает проход по ссылкам в документе. |
| index | разрешает индексирование документа. |
| follow | разрешает проход по ссылкам в документе. |
Настройка области просмотра
Обращаю Ваше внимание на то, что область просмотра определяет, как веб-страница отображается на мобильном устройстве, если она не задана, то ширина страницы считается равной стандартному значению, и она уменьшается на мобильном устройстве, чтобы поместиться на его экране.
Для того, чтобы мобильные браузеры автоматически не изменяли размер страниц сайта, необходимо в теге <head> разместить метатег, который сообщает браузеру, как обрабатывать размеры страницы и изменять ее масштаб:
<meta name = "viewport" content = "width=device-width, initial-scale = 1">
- Атрибут name задает имя документа метаданным, значение «viewport» дает подсказку браузеру о размере начального размера области просмотра. Функция атрибута content задать значения для этого атрибута.
- Значение width=device-width атрибута content сообщает, что ширина страницы устанавливается в соответствии с размером экрана устройства в аппаратно-независимых пикселях (device-independent pixel, dip), что позволяет странице пересчитывать положение элементов для корректного отображения на различных экранах. По аналогии допускается указать значения для высоты height=device-height.
- Значение initial-scale=1 атрибута content сообщает браузеру, что необходимо установить соответствие 1:1 для пикселей CSS и аппаратно-независимых пикселей вне зависимости от ориентации устройства (альбомной или портретной).
Если все страницы Вашего сайта адаптированы для просмотра на мобильных устройствах, то размещение вышеуказанного мета тега является обязательным.
Доступные значения:
| Значение атрибута | Определение |
|---|---|
| width | Определяет ширину в пикселях области просмотра (значение — положительное целое число или device-width). |
| height | Определяет высоту в пикселях области просмотра (значение — положительное целое число или device-height). |
| initial-scale | Определяет соотношение между шириной устройства (device-width в портретном режиме или device-height в ландшафтном режиме) и размером области просмотра. Чем больше число, тем выше масштаб. Значение — положительное целое число от 0.0 до 10.0. |
| minimum-scale | Определяет минимальное значение zoom (оно должно быть меньше или равно maximum-scale). Значение — положительное целое число от 0.0 до 10.0. |
| maximum-scale | Определяет максимальное значение zoom (оно должно быть больше или равно minimum-scale). Значение — положительное целое число от 0.0 до 10.0. |
| user-scalable | Логическое значение, которое определяет, может ли пользователь увеличить масштаб веб-страницы. Значение по умолчанию yes (пользователь может увеличивать масштаб). |
Отличия HTML 4.01 от HTML 5
Нет.Пример использования
<!DOCTYPE html> <html> <head> <meta name = "description" content = "Бесплатные уроки по созданию сайтов" > <!-- мета элемент, который описывает содержимое документа --> <meta name = "keywords" content = "HTML, CSS, JavaScript, jQuery"> <!-- мета элемент, который описывает ключевые слова в документе --> <meta name = "author" content = "Denis Bolshakov"> <!-- мета элемент, который указывает имя автора документа --> <title>Пример использования атрибута name тега <meta></title> </head> <body> <h3> Это заголовок.</h3> <p>Это параграф. </p> </body> </html>
В данном примере мы использовали три элемента <meta>:
- первый мета элемент описывает содержимое документа (значением атрибута name мы указали, что это описание страницы (description), а текстовое содержимое указали в атрибуте content. Это описание могут использовать поисковые машины для отображения результатов поиска.
- второй мета элемент описывает ключевые слова в документе (значением атрибута name мы указали, что это ключевые слова (keywords), а текстовое содержимое указали в атрибуте content. Ключевые слова могут использоваться некотрыми поисковыми машинами.
- третий мета элемент описывает имя автора документа (значением атрибута name мы указали, что это автор документа (author), а имя автора указали в атрибуте content.
HTML тег <meta>
Атрибут name тега | HTML справочник
HTML тег <form>Значение и применение
Атрибут name (HTML тега <form>) определяет имя формы, которое используется для идентификации (задает имя для формы). Атрибут может использоваться для ссылки на элементы в JavaScript, или ссылаться на данные формы после её отправки на сервер.
Обращаю Ваше внимание, что в XHTML атрибут name считается устаревшим. Используйте вместо него глобальный HTML атрибут id для идентификации формы.
Поддержка браузерами
Синтаксис:
<form name = "text">
Значения атрибута
| Значение | Описание |
|---|---|
| text | Задает имя формы. |
Отличия HTML 4.01 от HTML 5
Нет.Пример использования
<!DOCTYPE html> <html> <head> <title>Использование атрибута name HTML тега <form></title> </head> <body> <form name = "subscribeForm"> <!-- определяем имя для нашей формы --> Имя: <input type = "text" name = "userName"> <!-- определяем элемент управления для ввода текстовой информации --> E-mail: <input type = "email" name = "email"> <!-- определяем элемент управления для ввода адреса электронной почты --> <input type = "submit" value = "Подписаться"> <!-- определяем кнопку отправки формы --> </form> </body> </html>
В данном примере мы создали форму (HTML тег <form>), атрибутом name определили имя для нашей формы. Кроме того, создали внутри формы три элемента <input>, предназначенные для ввода текстовой информации, для ввода адреса электронной почты и для отправки формы.
Результат нашего примера:
Пример использования атрибута name HTML тега <form>.HTML тег <form>Атрибут name тега | HTML справочник
HTML тег <input>Значение и применение
Атрибут name (HTML тега <input>) задает имя для элемента. Атрибут name используется для поиска (выбора) элементов с использованием языка программирования JavaScript, а так же позволяет ссылаться на данные формы после их отправки.
Обратите внимание, что только те элементы формы, которые имеют атрибут name, будут иметь свои значения при отправке формы.
Поддержка браузерами
Синтаксис:
<input name = "text">
Значения атрибута
| Значение | Описание |
|---|---|
| text | Задает имя для элемента <input>. |
Отличия HTML 4.01 от HTML 5
Нет.Пример использования
<!DOCTYPE html> <html> <head> <title>Пример использования атрибута name HTML тега <input></title> </head> <body> <form name = "myForm"> <!-- создаем форму --> <label>Ваш логин<input type = "text" name = "Login"></label><br> <!-- поле для ввода текстовой информации --> <label>Ваш пароль<input type = "password" name = "Password"></label><br> <!-- поле для ввода пароля --> <input type = "submit" name = "submitForm" value = "войти"> <!-- кнопка для отправки формы --> </form> </body> </html>
В данном примере мы создали форму (HTML тег <form>). Внутри формы мы поместили три элемента управления <input>, которые предназначены для ввода текстовой информации, пароля и отправки формы. Обратите внимание, что для каждого элемента <input> мы указали атрибутом name его имя, в том числе указали имя и для нашей формы (элемент <form> имеет одноимённый атрибут).
Результат нашего примера:
Пример использования атрибута name HTML тега <input> (указание имени элемента).HTML тег <input>Атрибут name тега | HTML справочник
HTML тег <button>Значение и применение
Атрибут name (HTML тега <button>) задает имя для кнопки, которое передается при отправке формы.
Обращаю Ваше внимание, что допускается использовать одинаковые имена для кнопок в пределах одной формы, но при этом необходимо, чтобы они имели различные значения (атрибут value). Имя кнопки может использоваться при работе клиентских скриптов на языке Javascript.
Поддержка браузерами
Синтаксис:
<button name = "name">
Значения атрибута
| Значение | Описание |
|---|---|
| name | Задает имя для кнопки, которое передается при отправке формы. |
Отличия HTML 4.01 от HTML 5
Нет.Пример использования
<!DOCTYPE html> <html> <head> <title>Пример использования атрибута name HTML тега <button></title> </head> <body> <form> Choose your destiny:<br> <button name = "destiny" type = "submit" value = "novice">Novice</button> <button name = "destiny" type = "submit" value = "warrior">Warrior</button> <button name = "destiny" type = "submit" value = "master">Master</button> <button name = "destiny" type = "submit" value = "grandmaster">Grandmaster</button> </form> </body> </html>
В данном примере мы:
- Создали четыре элемента <button> с типом, предназначенным для отправки данных формы на сервер (атрибут type).
- Атрибутом name присвоили для каждой кнопки одинаковое имя.
- Атрибутом value указали уникальные значения для каждой кнопки.
Результат нашего примера:
Пример использования атрибута name HTML тега <button> (имя для кнопки).HTML тег <button>Атрибут name | HTML | WebReference
Определяет уникальное имя элемента <select>. Как правило, это имя используется для доступа к данным через скрипты или для получения выбранного значения списка на сервере.
Синтаксис
<select name="<имя>">...</select>Значения
В качестве имени используется набор символов, включая числа и буквы. JavaScript чувствителен к регистру, поэтому при обращении к элементу <select> по имени соблюдайте ту же форму написания, что и в атрибуте name.
Значение по умолчанию
Пример
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>SELECT, атрибут name</title>
<script>
function dataSelect(f) {
n = f.hero.selectedIndex
if(n) alert("Выбран герой: " + f.hero.options[n].value)
}
</script>
</head>
<body>
<form action="handler.php">
<p><select name="hero">
<option>Выберите героя</option>
<option value="Чебурашка">Чебурашка</option>
<option value="Крокодил Гена">Крокодил Гена</option>
<option value="Шапокляк">Шапокляк</option>
<option value="Крыса Лариса">Крыса Лариса</option>
</select>
<input type="button" value="OK"></p>
</form>
</body>
</html>Браузеры
В таблице браузеров применяются следующие обозначения.
- — элемент полностью поддерживается браузером;
- — элемент браузером не воспринимается и игнорируется;
- — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.
Число указывает версию браузреа, начиная с которой элемент поддерживается.
×Автор и редакторы
Автор: Влад Мержевич
Последнее изменение: 03.01.2017
Редакторы: Влад Мержевич
Атрибут name
Определение и использование
Атрибут name указывает имя элемента.
Атрибут name можно использовать для ссылки на элемент в JavaScript.
Для элемента form, атрибут name также используется в качестве ссылки при представлении данных.
Для элемента iframe, атрибут name может использоваться для целевой отправки формы.
Для элемента map, атрибут name связан с <img> атрибут usemap создает связь между изображением и картой.
Для элемента meta, атрибут name задает имя для информации / значения атрибута content.
Для элемента param, атрибут name используется вместе с атрибутом value для задания параметров плагина, указанного в теге <object>.
Применение
Атрибут name можно использовать для следующих элементов:
Примеры
Пример
Две кнопки с одинаковыми именами, которые отправляют разные значения при нажатии:
<form action=»/action_page.php» method=»get»>
Выберите свою любимую тему:
<button name=»subject» type=»submit» value=»HTML»>HTML</button>
<button name=»subject» type=»submit» value=»CSS»>CSS</button>
</form>
Пример Fieldset
Элемент <fieldset> с атрибутом name:
<fieldset name=»personalia»>
Имя: <input type=»text»><br>
Эл.Почта: <input type=»text»><br>
</fieldset>
Пример Form
Форма HTML с атрибутом name:
<form action=»/action_page.php»method=»get» name=»myForm»>
Имя: <input type=»text» name=»fname»><br>
Фамилия: <input type=»text» name=»lname»><br>
<input type=»button» value=»Отправить данные формы!»>
</form>
Пример Iframe
Элемент <iframe> действует как цель для ссылки:
<a href=»https://www.schoolsw3.com» target=»iframe_a»>SchoolsW3.com</a>
Попробуйте сами »Пример Input
форма HTML с тремя полями ввода; два текстовых поля и одна кнопка отправки:
<form action=»/action_page.php»>
Имя: <input type=»text» name=»fullname»><br>
Эл.Почта: <input type=»text» name=»email»><br>
<input type=»submit» value=»Отправить»>
</form>
Пример Map
Изображение-карта с кликабельными областями:
<map name=»planetmap»>
<area shape=»rect» coords=»0,0,82,126″ href=»sun.html» alt=»Cолнце»>
<area shape=»circle» coords=»90,58,3″ href=»mercur.html» alt=»Меркурий»>
<area shape=»circle» coords=»124,58,8″ href=»venus.html» alt=»Венера»>
</map>
Пример Meta
Атрибут name используется для определения описания, ключевых слов и автора документа HTML:
<head>
<meta name=»description» content=»Бесплатные веб учебники»>
<meta name=»keywords» content=»HTML,CSS,JavaScript»>
<meta name=»author» content=»Щипунов Андрей»>
</head>
Пример Object
Элемент <object> с атрибутом name :
<object data=»helloworld.swf»name=»obj1″></object>
Попробуйте сами »Пример Output
Выполните расчет и покажите результат в элементе <output> :
<form oninput=»x.value=parseInt(a.value)+parseInt(b.value)»>0
<input type=»range» value=»50″>100
+<input type=»number» value=»50″>
=<output name=»x» for=»a b»></output>
</form>
Пример Param
Установите «autoplay» параметр к «true», таким образом, звук начнет играть, как только страница будет загружаться:
<object data=»horse.wav»>
<param name=»autoplay» value=»true»>
</object>
Пример Select
Раскрывающийся список с атрибутом name:
<select name=»cars»>
<option value=»вольво»>Вольво</option>
<option value=»сааб»>Сааб</option>
<option value=»опель»>Опель</option>
<option value=»ауди»>Ауди</option>
</select>
Пример Textarea
Текстовое поле с атрибутом name:
<form action=»/action_page.php»>
<textarea name=»comment»>Введите текст здесь…</textarea>
<input type=»submit»>
</form>
Поддержка браузеров
Атрибут multiple имеет следующую поддержку браузера для каждого элемента:
| Элемент | |||||
|---|---|---|---|---|---|
| button | Да | Да | Да | Да | Да |
| fieldset | Да | Не поддерживает | Да | Да | Да |
| form | Да | Да | Да | Да | Да |
| iframe | Да | Да | Да | Да | Да |
| input | 1.0 | 2.0 | 1.0 | 1.0 | 1.0 |
| map | Да | Да | Да | Да | Да |
| meta | Да | Да | Да | Да | Да |
| object | Да | Да | Да | Да | Да |
| output | 10.0 | Не поддерживает | 4.0 | 5.1 | 11.0 |
| param | Да | Да | Да | Да | Да |
| select | Да | Да | Да | Да | Да |
| textarea | Да | Да | Да | Да | Да |
Атрибут name | htmlbook.ru
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 3.0+ | 1.0+ | 4.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
| HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Определяет уникальное имя элемента <select>. Как правило, это имя используется для доступа к данным через скрипты или для получения выбранного значения списка на сервере.
Синтаксис
<select name="имя">...</select>Значения
В качестве имени используется набор символов, включая числа и буквы. JavaScript чувствителен к регистру, поэтому при обращении к элементу <select> по имени соблюдайте ту же форму написания, что и в атрибуте name.
Значение по умолчанию
Нет.
Пример
HTML5IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег SELECT, атрибут name</title>
<script>
function dataSelect(f) {
n = f.hero.selectedIndex
if(n) alert("Выбран герой: " + f.hero.options[n].value)
}
</script>
</head>
<body>
<form action="handler.php">
<p><select name="hero">
<option>Выберите героя</option>
<option value="Чебурашка">Чебурашка</option>
<option value="Крокодил Гена">Крокодил Гена</option>
<option value="Шапокляк">Шапокляк</option>
<option value="Крыса Лариса">Крыса Лариса</option>
</select>
<input type="button" value="OK"></p>
</form>
</body>
</html>