Tutorials References Menu

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:

Elements Attribute
<button> name
<fieldset> name
<form> name
<iframe> name
<input> name
<map> name
<meta> name
<object> name
<output> name
<param> name
<select> name
<textarea> name

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>
Try it Yourself »

Fieldset Example

A <fieldset> with a name attribute:

<fieldset name="personalia">
  Name: <input type="text"><br>
  Email: <input type="text"><br>
</fieldset>
Try it Yourself »

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>
Try it Yourself »

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.w3schools.com" target="iframe_a">W3Schools.com</a>
Try it Yourself »

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>
Try it Yourself »

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>
Try it Yourself »

Meta Example

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

<head>
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,JavaScript">
<meta name="author" content="Hege Refsnes">
</head>
Try it Yourself »

Object Example

An <object> element with a name attribute:

<object data="helloworld.swf" width="400" height="400" name="obj1"></object>
Try it Yourself »

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>
Try it Yourself »

Param Example

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

<object data="horse.wav">
  <param name="autoplay" value="true">
</object>
Try it Yourself »

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>
Try it Yourself »

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>
Try it Yourself »

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