Labels

HTML name Attribute

Definition and Usage

The name attribute specifies a name for an HTML element.

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

For a <form> element, the name attribute is used as a reference when the data is submitted.

For an <iframe> element, the name attribute can be used to target a form submission.

For a <map> element, the name attribute is associated with the <img>'s usemap attribute and creates a relationship between the image and the map.

For a <meta> element, the name attribute specifies a name for the information/value of the content attribute.

For a <param> element, the name attribute is used together with the value attribute to specify parameters for the plugin specified with the <object> tag.

Applies to

The name attribute can be used on the following elements:

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>

Fieldset Example

A <fieldset> with a name attribute:

<fieldset name="personalia">
Name: <input type="text"><br>
Email: <input type="text"><br>
</fieldset>

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:

<iframe src="demo_iframe.htm" name="iframe_a"></iframe>

<a href="https://www.pinfinitys.com" target="iframe_a">PI.com</a>

Input Example

An HTML form with three input fields; two text fields and one submit button:

<form action="/action_page.php">
Name: <input type="text" name="fullname"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>

Map Example

An image map, with clickable areas:

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

Meta Example

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

<head>
<meta name="description" content="Programming in a way to Understand">
<meta name="keywords" content="HTML,CSS,JavaScript,Android">
<meta name="author" content="SamS">
</head>

Object Example

An <object> element with a name attribute:

<object data="love.jpg" width="400" height="400" name="obj1"></object>

Output Example

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

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>

Param Example

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

<object data="love.mp4">
<param name="autoplay" value="true">
</object>

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>

Browser Support

The multiple attribute has the following browser support for each element:

Element          
button Yes Yes Yes Yes Yes
fieldset Yes Not supported Yes Yes Yes
form Yes Yes Yes Yes Yes
iframe Yes Yes Yes Yes Yes
input 1.0 2.0 1.0 1.0 1.0
map Yes Yes Yes Yes Yes
meta Yes Yes Yes Yes Yes
object Yes Yes Yes Yes Yes
output 10.0 Not supported 4.0 5.1  11.0
param Yes Yes Yes Yes Yes
select Yes Yes Yes Yes Yes
textarea Yes Yes Yes Yes Yes
Tags

Comments

Post a Comment