Атрибут name

HTML Справочник

HTML Теги по алфавитуHTML Теги по категорииHTML ПоддержкаHTML АтрибутыHTML ГлобальныеHTML СобытияHTML Названия цветаHTML ХолстHTML Аудио/ВидеоHTML ДекларацииHTML Набор кодировокHTML URL кодHTML Коды языкаHTML Коды странHTTP СообщенияHTTP методыКовертер PX в EMКлавишные комбинации

HTML Теги

<!—…—>
<!DOCTYPE>
<a>
<abbr>
<acronym>
<address>
<applet>
<area>
<article>
<aside>
<audio>
<b>
<base>
<basefont>
<bdi>
<bdo>
<big>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<data>
<datalist>
<dd>
<del>
<details>
<dfn>
<dialog>
<dir>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figcaption>
<figure>
<font>
<footer>
<form>
<frame>
<frameset>
<h1> — <h6>
<head>
<header>
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins>
<kbd>
<label>
<legend>
<li>
<link>
<main>
<map>
<mark>
<meta>
<meter>
<nav>
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<output>
<p>
<param>
<picture>
<pre>
<progress>
<q>
<rp>
<rt>
<ruby>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strike>
<strong>
<style>
<sub>
<summary>
<sup>
<svg>
<table>
<tbody>
<td>
<template>
<textarea>
<tfoot>
<th>
<thead>
<time>
<title>
<tr>
<track>
<tt>
<u>
<ul>
<var>
<video>
<wbr>

HTML References

HTML by AlphabetHTML by CategoryHTML Browser SupportHTML AttributesHTML Global AttributesHTML EventsHTML ColorsHTML CanvasHTML Audio/VideoHTML Character SetsHTML DoctypesHTML URL EncodeHTML Language CodesHTML Country CodesHTTP MessagesHTTP MethodsPX to EM ConverterKeyboard Shortcuts

HTML Теги

<!—…—><!DOCTYPE><a><abbr><acronym><address><applet><area><article><aside><audio><b><base><basefont><bdi><bdo><big><blockquote><body><br><button><canvas><caption><center><cite><code><col><colgroup><data><datalist><dd><del><details><dfn><dialog><dir><div><dl><dt><em><embed><fieldset><figcaption><figure><font><footer><form><frame><frameset><h1> — <h6><head><header><hr><html><i><iframe><img><input><ins><kbd><label><legend><li><link><main><map><mark><meta><meter><nav><noframes><noscript><object><ol><optgroup><option><output><p><param><picture><pre><progress><q><rp><rt><ruby><s><samp><script><section><select><small><source><span><strike><strong><style><sub><summary><sup><svg><table><tbody><td><template><textarea><tfoot><th><thead><time><title><tr><track><tt><u><ul><var><video>

12.4 Path information: the BASE element

<!ELEMENT  - O EMPTY               -- document base URI -->
<!ATTLIST BASE
                    #REQUIRED -- URI that acts as base URI --
  >

Start tag: required, End tag:
forbidden

Attribute definitions

href =: This attribute specifies an absolute URI that acts as the base URI for
resolving relative URIs.

Attributes defined elsewhere

target (target
frame information)

In HTML, links and references to external images, applets, form-processing
programs, style sheets, etc. are always specified by a URI. Relative URIs are
according to a base URI, which
may come from a variety of sources. The element allows authors to specify a document’s base URI explicitly.

When present, the element must appear in the
section of an HTML document, before any element that refers to an external
source. The path information specified by the element only affects URIs in
the document where the element appears.

For example, given the following declaration and
declaration:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
 <HEAD>
   <TITLE>Our Products</TITLE>
   <BASE href="http://www.aviary.com/products/intro.html">
 </HEAD>

 <BODY>
   <P>Have you seen our <A href="../cages/birds.gif">Bird Cages</A>?
 </BODY>
</HTML>

the relative URI «../cages/birds.gif» would resolve to:

http://www.aviary.com/cages/birds.gif

12.4.1 Resolving relative URIs

User agents must calculate the base URI for resolving relative URIs
according to , section 3. The following describes how applies specifically to HTML.

User agents must calculate the base URI according to the following
precedences (highest priority to lowest):

The base URI is set by the element.
The base URI is given by meta data discovered during a protocol
interaction, such as an HTTP header (see ).
By default, the base URI is that of the current document. Not all HTML
documents have a base URI (e.g., a valid HTML document may appear in an email
and may not be designated by a URI). Such HTML documents are considered
erroneous if they contain relative URIs and rely on a default base URI.

Additionally, the and elements define attributes that
take precedence over the value set by the element. Please consult the
definitions of these elements for more information about URI issues specific to
them.

Note. For versions of HTTP that define a Link header,
user agents should handle these headers exactly as
elements in the document. HTTP 1.1 as defined by does not
include a Link header field (refer to section 19.6.3).

previous next
elements attributes
index

12.3 Document relationships: the LINK element

<!ELEMENT  - O EMPTY               -- a media-independent link -->
<!ATTLIST LINK
                                -- , ,  --
             #IMPLIED  -- char encoding of linked resource --
                    #IMPLIED  -- URI for linked resource --
       #IMPLIED  -- language code --
            #IMPLIED  -- advisory content type --
               #IMPLIED  -- forward link types --
               #IMPLIED  -- reverse link types --
             #IMPLIED  -- for rendering on these media --
  >

Start tag: required, End tag:
forbidden

Attributes defined elsewhere

, ()
(), ()
()
( )
, , , , , , , , , ( )
, , , , ()
()
()
()

This element defines a link. Unlike , it may only appear in the
section of a document, although it may appear any number of times. Although
has no content, it conveys relationship information that may be rendered by
user agents in a variety of ways (e.g., a tool-bar with a drop-down menu of
links).

This example illustrates how several definitions may appear in the
section of a document. The current document is «Chapter2.html». The
attribute specifies the relationship of the linked document with the current
document. The values «Index», «Next», and «Prev» are explained in the section
on .

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
  <TITLE>Chapter 2</TITLE>
  <LINK rel="Index" href="../index.html">
  <LINK rel="Next"  href="Chapter3.html">
  <LINK rel="Prev"  href="Chapter1.html">
</HEAD>
...the rest of the document...

12.3.1 Forward and reverse links

The and attributes play complementary roles — the
attribute specifies a forward link and the attribute specifies a reverse
link.

Consider two documents A and B.

Document A:       <LINK href="docB" rel="foo">

Has exactly the same meaning as:

Document B:       <LINK href="docA" rev="foo">

Both attributes may be specified simultaneously.

12.3.2 Links and external style sheets

When the element links an external style sheet to a document, the attribute specifies the style sheet language and the attribute specifies the intended rendering medium or media.
User agents may save time by retrieving from the network only those style
sheets that apply to the current device.

are further
discussed in the section on style sheets.

12.3.3 Links and search engines

Authors may use the element to provide a variety of information to
search engines, including:

Links to alternate versions of a document, written in another human
language.
Links to alternate versions of a document, designed for different media,
for instance a version especially suited for printing.
Links to the starting page of a collection of documents.

The examples below illustrate how language information, media types, and
link types may be combined to improve document handling by search engines.

In the following example, we use the attribute to tell search
engines where to find Dutch, Portuguese, and Arabic versions of a document.
Note the use of the attribute for the Arabic manual. Note also the
use of the attribute to indicate that the value of the
attribute for the element designating the French manual is in French.

<HEAD>
<TITLE>The manual in English</TITLE>
<LINK title="The manual in Dutch"
      type="text/html"
      rel="alternate"
      hreflang="nl" 
      href="http://someplace.com/manual/dutch.html">
<LINK title="The manual in Portuguese"
      type="text/html"
      rel="alternate"
      hreflang="pt" 
      href="http://someplace.com/manual/portuguese.html">
<LINK title="The manual in Arabic"
      type="text/html"
      rel="alternate"
      charset="utf-8"
      hreflang="ar" 
      href="http://someplace.com/manual/arabic.html">
<LINK lang="fr" title="La documentation en Fran&ccedil;ais"
      type="text/html"
      rel="alternate"
      hreflang="fr"
      href="http://someplace.com/manual/french.html">
</HEAD>

In the following example, we tell search engines where to find the printed
version of a manual.

<HEAD>
<TITLE>Reference manual</TITLE>
<LINK media="print" title="The manual in postscript"
      type="application/postscript"
      rel="alternate"
      href="http://someplace.com/manual/postscript.ps">
</HEAD>

In the following example, we tell search engines where to find the front
page of a collection of documents.

<HEAD>
<TITLE>Reference manual -- Page 5</TITLE>
<LINK rel="Start" title="The first page of the manual"
      type="text/html"
      href="http://someplace.com/manual/start.html">
</HEAD>

Further information is given in the notes in the appendix on .

Creating an HTML Syntax Using the Name Attribute in HTML

Creating the HTML syntax using the name attribute is an easy process that does not require a lot of time and effort. All you are supposed to do is to include the attribute inside the opening HTML tag and assign it with a specific value. Since we have provided you with a list of some of the most common elements later in this article, we are going to take a look at them in action first. Though you can create more complex syntaxes, we are going to provide examples that are easy to comprehend and reuse.

– Creating Two Buttons With the Same Name Value

The first example we are going to show you is going to represent two HTML buttons that are going to have the same HTML name attribute value. We explained that this is the only acceptable case where you can have two elements with the same name value.

We are going to include other HTML elements and attributes to create fully-functional HTML buttons, as shown in the following example:

<form action=”/choice_page.php” method=”get”>Choose your favorite school subject:<button name=”subject” type=”submit” value=”biology”> Biology </button><button name=”subject” type=”submit” value=”chemistry”> Chemistry </button></form>

As you can see, there are several elements and attributes you are supposed to include to make the buttons work. Also, the HTML name is the first attribute used in the opening button tag. Now, let us move on to the next example.

– Creating a Fieldset Containing Two Input Elements

In this example, we are going to create a single HTML fieldset element that is going to contain the HTML name attribute. We are going to nest two input elements but adding this property is not required in their opening tags.

The syntax is easy to create and only consists of several lines of code, as shown in the following example:

<fieldset name=”information”>Name: <input type=”text”> <br>Email: <input type=”text”> <br></fieldset>

– Creating a Map Containing the HTML Image Element

As mentioned before, you are supposed to use the HTML name attribute with the HTML map and image elements. The HTML image element is going to introduce the image whereas the HTML map element is going to define the shape of the image.

You are supposed to include the HTML area element between the opening HTML map tags, as in the following example:

This example captures the importance of using the HTML image and map elements at once. Also, the HTML name attribute creates the link and makes everything work properly. Finally, let us see what the last example is all about.

– Creating a Meta Description Using the HTML Name Attribute

The last example we are going to provide is going to show you how to use the HTML meta element and the name attribute. The function of the attribute is to describe the meta element by assigning a specific value.

All you have to do is to make sure that the value of the name attribute is different for all elements, as shown here:

The HTML meta element does not have a closing tag. Besides the HTML name attribute, we have also included the content attribute to complete the meta syntax. This example wraps up the proper way of implementing the HTML name attribute inside various elements throughout the HTML document.

Definition and Usage

The attribute specifies a name for an HTML element.

This attribute can be used to reference the element in a JavaScript.

For a element, the attribute is used as a reference when the data is submitted.

For an element, the attribute can be used to target a form submission.

For a element, the attribute is associated with the ‘s
attribute and creates a relationship between the image and the map.

For a element, the attribute specifies a name for the information/value of the
attribute.

For a element, the attribute is used together with the attribute to specify
parameters for the plugin specified with the
tag.

Use Id and name attribute of html element

The attribute specifies a unique id for an HTML element; the id value must be unique within the HTML document. So if we want to find that element by id, it should return one element.

<input type="button" id="btn1" name="btn1" />


// get element by id
var btn=document.getElementById("btn1");


// get element by name
var btn1=document.getElementByName("btn1");

In CSS we define the id with hashtag, and in html we set that id.

Let’s look at the example below

<style>     
#dvMessage {
background-color: #000;
color: #fff;
padding: 10px;
text-align: center;
}
</style>
<div id="dvMessage">Welcome to WebTrainingRoom </div>

Welcome to WebTrainingRoom

We can use id attribute on any HTML element, remember that the id value is always case-sensitive, id value should be unique and not blank.

html id attribute vs name attribute

ID is not same as Class in Css, there are some difference between Class and ID.

<style>
#dvMessage {
    background-color: #000;
    color: #fff;
    padding: 10px;
    text-align: center;
}
            
.studentName 
{
    padding: 8px;
    color: #0113a5;
    font-size: 15px;
}
</style>
            
<div id="dvMessage"> Welcome to WebTrainingRoom </div>
            
<div class="studentName"> Arundhuti</div>
            
<div class="studentName"> Gargi</div>
            
<div class="studentName">Anshuman </div>

Now if you notice in above example, same class name can be repeated, but id value will be unique in current document

In javascript we can get this element by id, in DOM there is in-built method “getElementsById”

Learn name attribute in HTML

we can define a name of any html control and then access that control with name.

Let’s look at example

<script> 
function showDetails() {
document.getElementsByName("btnStudent").value = "WTR Button";
}
</script>
<input type="button" name="btnStudent" onclick="showDetails();" />

html class vs id

Here i will give another example of html class vs id using jquery, you will see how differently it works when we are selecting any html element by Id and selecting any html element by css class name.

In below example we access a html button by id and by class name. suppose we have a button with id «btnShow»

<input type="button" id="btnShow" value="Show (by id)">      
<script>
$(document).ready(function () {
    $("#btnShow").click(function () {
        //$("p").show(); you can execute any code here
        alert("you are calling by id");
    });
});
</script>

Remember id is always unique, means you can have only one element with that id on same page.

But you can have multiple elements with same css class name

<input type="button" class="btn" value="Show (by class)">
<script>
$(document).ready(function () {
    $(".btnClass").click(function () {
        //$("p").show(); you can execute any code here
        alert("you are calling by id");
    });
});
</script>

Html id is very useful for setting dynamic behaviour of any html control in webpage; we can select any html element by id in jquery function.

The HTML Name Attribute Documents: Looking at the Basics

There is no better way of assigning a unique identifier for any element in your document other than the HTML name and HTML tag attributes. The HTML name attribute is always used in the opening tag of an HTML document and you must assign it with a specific name value.

Creating unique identifiers for your HTML elements has plenty of benefits. The easiest way to link any CSS styling property or JavaScript function to an element inside your document is by using its unique identifier.

However, you should also know that the HTML5 name attribute does not exist anymore. Instead, you are supposed to use the HTML id attribute that has the same form and function as the name attribute. Nevertheless, we are going to teach you everything you need to know about how the HTML name attribute is used inside a document containing more elements.

In the following section of this article, we are going to take a look at some important facts about the name attribute.

Final Overview and Summary

The HTML name attribute is used when trying to assign a unique name identifier for any element in your HTML document. This article managed to cover a lot of important points about the process of using the name attribute and they are all summarized in the following list:

The HTML name attribute creates a unique name for any HTML element
You are always supposed to include this attribute in the opening HTML tag
You must assign a specific value to the HTML name attribute
Once combined with other HTML elements, the name attribute has additional functions
A lot of HTML elements support the use of the name attribute in their opening tags
Creating the syntax is a process that is easy to comprehend
Some HTML elements do not have a closing HTML tag

Working with the HTML name attribute does not have to be a complicated process, as this article managed to prove. After carefully reading every section of it, you are ready to effortlessly implement the HTML name attribute in your next HTML project.

HTML Tags

<!—><!DOCTYPE><a><abbr><acronym><address><applet><area><article><aside><audio><b><base><basefont><bdi><bdo><big><blockquote><body><br><button><canvas><caption><center><cite><code><col><colgroup><data><datalist><dd><del><details><dfn><dialog><dir><div><dl><dt><em><embed><fieldset><figcaption><figure><font><footer><form><frame><frameset><h1> — <h6><head><header><hr><html><i><iframe><img><input><ins><kbd><label><legend><li><link><main><map><mark><meta><meter><nav><noframes><noscript><object><ol><optgroup><option><output><p><param><picture><pre><progress><q><rp><rt><ruby><s><samp><script><section><select><small><source><span><strike><strong><style><sub><summary><sup><svg><table><tbody><td><template><textarea><tfoot><th><thead><time><title><tr><track><tt><u><ul><var><video>

Looking at Important Notes

Creating the HTML name attribute syntax is an easy process but, in this section, we are going to provide you with some important notes. Every HTML element and attribute has a specific function and experts use them on daily basis. As mentioned before, the HTML name attribute is not supported in HTML5 but you can use the id attribute that has the same function. Let us take a closer look at some of the most important notes about the HTML name attribute in the following list:

Any HTML element in your document can have a unique identifier
You cannot create an empty string value for the HTML name attribute
HTML radio and checkbox elements can have the same unique identifier
You can use the same HTML name attribute value in all HTML radio buttons
The HTML name attribute has a specific function once used with specific elements
The HTML name attribute used to be valid on frames and applets but it is now obsolete

This list perfectly captures all the important quirks and features that the HTML name attribute has to offer. One point from this list stated that this attribute has a specific function once used with different HTML elements. That is why in the following part of the article, we are going to learn the relationship between the HTML name attribute and other common elements.

Relation With Other Elements

Every HTML element has a specific function but you can improve its syntax by using HTML attributes. One of the most common HTML attributes is the name or the id in HTML5. In this section, we are going to explain and exemplify what happens once you introduce the HTML name attribute in the opening HTML tags.

The function and use can be seen in the following list:

The HTML <form> element – used as a reference when specific data is submitted
The HTML <iframe> element – the name attribute is used as a target for form submission
The HTML <map> element – creates a relationship between the HTML <map> element and the HTML <img> element
The HTML <meta> element – used to specify a name for the value of the content attribute
The HTML <param> element – the name attribute is used alongside the value attribute and they create specific parameters for the specified plugin

Once you introduce the HTML name attribute in these elements, an additional function is created other than representing a unique identifier. However, these are not the only elements that support the name attribute. In the following section of this article, we are going to list all elements that support the HTML name attribute and its primary function.

– Other Elements That Support This Attribute

You can use the HTML name attribute with other elements but it will not have an additional function as with the elements listed above. Nevertheless, it is important to know that they exist and if you include the name attribute in the opening tag, you will not make a mistake.

Some of the other common HTML elements that support the name attribute are shown in the following list:

The HTML <button> element
The HTML <fieldset> element
The HTML <input> element
The HTML <object> element
The HTML <output> element
The HTML <select> element
The HTML <textarea> element

As you can see, we have only listed the HTML elements without specifying the use because it is the same for all. The HTML name attribute once used with the elements listed above represents a unique identifier. One of the best ways to learn everything about its implementation in HTML documents is to take a look at the examples we provided for you above.

Примеры

Пример

Две кнопки с одинаковыми именами, которые отправляют разные значения при нажатии:

<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» onclick=»formSubmit()» value=»Отправить данные формы!»>
</form>

Пример Iframe

Элемент <iframe> действует как цель для ссылки:

Пример Map

Изображение-карта с кликабельными областями:

Пример Meta

Атрибут name используется для определения описания, ключевых слов и автора документа HTML:

Пример Object

Элемент <object> с атрибутом name :

Пример Output

Выполните расчет и покажите результат в элементе <output> :

Пример Param

Установите «autoplay» параметр к «true», таким образом, звук начнет играть, как только страница будет загружаться:

Пример 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>

Examples

Example

Two buttons with equal names, that submit different values when clicked:

<form action=»/action_page.php» method=»get»>

Choose your favorite subject:

<button name=»subject» type=»submit» value=»HTML»>HTML</button>

<button name=»subject» type=»submit» value=»CSS»>CSS</button>
</form>

Form Example

An HTML form with a name attribute:

<form
action=»/action_page.php»
method=»get» name=»myForm»>

First name: <input type=»text» name=»fname»><br>

Last name:
<input type=»text» name=»lname»><br>

<input type=»button» onclick=»formSubmit()» value=»Send form data!»>
</form>

Iframe Example

An <iframe> that act as a target for a link:

Map Example

An image map, with clickable areas:

Meta Example

Use the name attribute to define a description, keywords, and the author of an HTML document:

Object Example

An <object> element with a name attribute:

Output Example

Perform a calculation and show the result in an <output> element:

Param Example

Set the «autoplay» parameter to «true», so the sound will start playing as
soon as the page loads:

Select Example

A drop-down list with a name attribute:

<select name=»cars»>

<option value=»volvo»>Volvo</option>

<option value=»saab»>Saab</option>

<option value=»opel»>Opel</option>

<option value=»audi»>Audi</option>
</select>

Textarea Example

A text area with a name attribute:

<form action=»/action_page.php»>

<textarea name=»comment»>Enter text here…</textarea>

<input type=»submit»>
</form>

HTML Справочник

HTML Теги

HTML References

HTML Tags

HTML Теги

12.4 Path information: the BASE element

12.4.1 Resolving relative URIs

12.3 Document relationships: the LINK element

12.3.1 Forward and reverse links

12.3.2 Links and external style sheets

12.3.3 Links and search engines

Creating an HTML Syntax Using the Name Attribute in HTML

– Creating Two Buttons With the Same Name Value

– Creating a Fieldset Containing Two Input Elements

– Creating a Map Containing the HTML Image Element

– Creating a Meta Description Using the HTML Name Attribute

Definition and Usage

Use Id and name attribute of html element

html id attribute vs name attribute

html class vs id

The HTML Name Attribute Documents: Looking at the Basics

Final Overview and Summary

HTML Tags

Looking at Important Notes

Relation With Other Elements

– Other Elements That Support This Attribute

Примеры

Пример

Пример Fieldset

Пример Form

Пример Iframe

Пример Map

Пример Meta

Пример Object

Пример Output

Пример Param

Пример Select

Пример Textarea

Examples

Example

Form Example

Iframe Example

Map Example

Meta Example

Object Example

Output Example

Param Example

Select Example

Textarea Example

Похожие записи:

Похожие записи: