Attribut de nom HTML
Définition et utilisation
L' name
attribut spécifie un nom pour un élément HTML.
Cet name
attribut peut être utilisé pour référencer l'élément dans un JavaScript.
Pour un <form>
élément, l'
name
attribut est utilisé comme référence lorsque les données sont soumises.
Pour un <iframe>
élément, l'
name
attribut peut être utilisé pour cibler une soumission de formulaire.
Pour un <map>
élément, l'
name
attribut est associé à l' attribut <img>
's
usemap
et crée une relation entre l'image et la carte.
Pour un <meta>
élément, l'
name
attribut spécifie un nom pour l'information/la valeur de l'
content
attribut.
Pour un <param>
élément, l'
name
attribut est utilisé avec l' value
attribut pour spécifier les paramètres du plugin spécifié avec la <object>
balise.
S'applique à
L' name
attribut peut être utilisé sur les éléments suivants :
Éléments | Attribut |
---|---|
<bouton> | Nom |
<ensemble de champs> | Nom |
<forme> | Nom |
<iframe> | Nom |
<entrée> | Nom |
<carte> | Nom |
<méta> | Nom |
<objet> | Nom |
<sortie> | Nom |
<param> | Nom |
<sélectionner> | Nom |
<zone de texte> | Nom |
Exemples
Exemple
Deux boutons avec des noms identiques, qui soumettent des valeurs différentes lorsqu'ils sont cliqués :
<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>
Exemple de jeu de champs
Un <fieldset> avec un attribut name :
<fieldset name="personalia">
Name: <input type="text"><br>
Email: <input type="text"><br>
</fieldset>
Exemple de formulaire
Un formulaire HTML avec un attribut name :
<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>
Exemple d'Iframe
Un <iframe> qui agit comme cible pour un lien :
<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a>
Exemple d'entrée
Un formulaire HTML avec trois champs de saisie ; deux champs de texte et un bouton d'envoi :
<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>
Exemple de carte
Une image cliquable, avec des zones cliquables :
<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>
Exemple de méta
Utilisez l'attribut name pour définir une description, des mots clés et l'auteur d'un document HTML :
<head>
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,JavaScript">
<meta name="author" content="Hege Refsnes">
</head>
Exemple d'objet
Un élément <object> avec un attribut name :
<object data="helloworld.swf" width="400" height="400"
name="obj1"></object>
Exemple de sortie
Effectuez un calcul et affichez le résultat dans un élément <output> :
<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>
Exemple de paramètre
Définissez le paramètre "autoplay" sur "true", pour que le son commence à jouer dès que la page se charge :
<object data="horse.wav">
<param name="autoplay" value="true">
</object>
Sélectionnez un exemple
Une liste déroulante avec un attribut name :
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
Exemple de zone de texte
Une zone de texte avec un attribut name :
<form action="/action_page.php">
<textarea name="comment">Enter text here...</textarea>
<input type="submit">
</form>
Prise en charge du navigateur
L' multiple
attribut est compatible avec les navigateurs suivants pour chaque élément :
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 |