Lors de l'utilisation du HTML <input> quelle est la différence entre l'utilisation de la balise name y id attributs surtout que j'ai découvert qu'ils portent parfois le même nom ?
Dans HTML4.01 :
Nom Attribut
<a> , <form> , <iframe> , <img> , <map> , <input> , <select> , <textarea>
getElementsByName()
id attributname sont soumis au serveurId Attribut
<base> , <html> , <head> , <meta> , <param> , <script> , <style> , <title>
# signegetElementById() et jQuery par $(#<id>)
_ ), les tirets ( - ), les deux-points ( : ), ou des points ( . )En (X)HTML5, tout est pareil, sauf.. :
Nom Attribut
<form> plusId Attribut
Cette question a été rédigée lorsque HTML4.01 était la norme, et que de nombreux navigateurs et fonctionnalités étaient différents de ceux d'aujourd'hui.
Veuillez noter que plusieurs points de cette réponse sont soit dépassés, soit tout simplement incorrects, de sorte qu'elle est trompeuse dans sa forme actuelle.
Il serait utile que les critiques précisent quels points sont "dépassés ou simplement incorrects" et à quelle version du HTML leurs commentaires s'appliquent.
L'attribut name est utilisé pour l'affichage sur un serveur web, par exemple. L'adresse id est principalement utilisé pour les CSS (et JavaScript). Supposons que vous ayez cette configuration :
<input id="message_id" name="message_name" type="text" />Afin d'obtenir la valeur avec PHP lors de l'affichage de votre formulaire, il utilisera la fonction nom comme ceci :
$_POST["message_name"];L'identifiant est utilisé pour le style, comme nous l'avons dit précédemment, lorsque vous souhaitez utiliser un contenu CSS spécifique.
#message_id
{
background-color: #cccccc;
}Bien sûr, vous pouvez utiliser la même dénomination pour votre id y nom attribut. Ces deux éléments n'interfèrent pas l'un avec l'autre.
Aussi, nom peut être utilisé pour plus d'éléments, comme lorsque vous utilisez des boutons radio. Le nom est alors utilisé pour regrouper vos boutons radio, afin que vous ne puissiez sélectionner qu'une seule de ces options.
<input id="button_1" type="radio" name="option" />
<input id="button_2" type="radio" name="option" />Et dans ce cas très spécifique, je peux encore dire comment id est utilisé, parce que vous voudrez probablement avoir une étiquette avec votre bouton radio. L'étiquette a un pour qui utilise l'attribut id de votre entrée pour lier cette étiquette à votre entrée (lorsque vous cliquez sur l'étiquette, le bouton est coché). Un exemple peut être trouvé ci-dessous
<input id="button_1" type="radio" name="option" /><label for="button_1">Text for button 1</label>
<input id="button_2" type="radio" name="option" /><label for="button_2">Text for button 2</label>
Je sais qu'il envoie les données au serveur web et que là, vous pouvez les stocker dans la base de données. (je donnais juste quelques exemples de ce que vous pouviez faire) Excusez-moi pour mon inattention à ce sujet, j'ai modifié ma réponse :)
+1 pour avoir mentionné le <label for> fonction de mise au point par clic. Cela ne fonctionne qu'avec les ID et non avec les attributs de nom.
Même si j'apprécie que vous vérifiez l'exactitude de votre réponse, je me demande si vous ne gagneriez pas du temps en remplaçant simplement "base de données" par "serveur web" au lieu d'une explication aussi verbeuse.
...dans l'arbre des éléments DOM de la page, de sorte que chaque contrôle est accessible individuellement par son id du côté client (dans la page du navigateur) en
Si votre page comporte des identifiants non uniques, elle sera quand même rendue, mais elle ne sera certainement pas valide. Les navigateurs sont assez indulgents lorsqu'ils analysent du HTML non valide, mais ne le faites pas juste parce que il semble que cela fonctionne.
...à l'intérieur du DOM de la page entre plusieurs contrôles du même type (pensez aux boutons radio) de sorte que lorsque les données obtiennent Posté à au serveur, seule une valeur particulière est envoyée. Ainsi, lorsque vous avez plusieurs boutons radio sur votre page, seule la valeur de celui qui est sélectionné est envoyée au serveur. value est renvoyée au serveur même s'il y a plusieurs contrôles de boutons radio liés avec la même name .
Addendum à l'envoi de données au serveur : Lorsque les données sont envoyées au serveur (généralement au moyen d'une requête HTTP POST), toutes les données sont envoyées en tant que paires nom-valeur donde nom est le
namedu contrôle HTML d'entrée et valeur est sonvaluetel que saisi/sélectionné par l'utilisateur. Ceci est toujours vrai pour les requêtes non-Ajax. Dans les requêtes Ajax, les paires nom-valeur puede être indépendant des contrôles de saisie HTML sur la page, car les développeurs peuvent envoyer ce qu'ils veulent au serveur. Très souvent, les valeurs sont également lues à partir des contrôles d'entrée, mais j'essaie juste de dire que ce n'est pas nécessairement le cas.
Il peut parfois être avantageux que les noms soient partagés entre les contrôles de tout type de saisie de formulaire. Mais quand ? Vous n'avez pas précisé quelle était la plate-forme de votre serveur, mais si vous utilisiez quelque chose comme ASP.NET MVC vous bénéficiez de la validation automatique des données (client et serveur) et vous pouvez également lier les données envoyées à des types forts. Cela signifie que ces noms doivent correspondre aux noms des propriétés de type.
Supposons maintenant que vous ayez ce scénario :
Ainsi, le modèle de votre vue (puisqu'elle affiche une liste) est de type IEnumerable<SomeType> mais votre serveur n'accepte qu'un seul élément de type SomeType .
Chaque article est emballé dans son propre FORM et les éléments d'entrée qu'il contient ont les mêmes noms, de sorte que lorsque les données arrivent sur le serveur (à partir de n'importe quel élément), elles sont correctement liées au type de chaîne attendu par l'action du contrôleur.
Ce scénario particulier peut être vu sur mon Histoires créatives mini-site. Vous ne comprendrez pas la langue, mais vous pouvez vérifier ces formulaires multiples et ces noms partagés. Peu importe que ID sont également dupliqués (ce qui est une violation des règles) mais cela pourrait être résolu. Cela n'a pas d'importance dans ce cas.
name identifie formulaire champs * Ils peuvent donc être partagés par des contrôles qui représentent plusieurs valeurs possibles pour un tel champ (boutons radio, cases à cocher). Ils seront soumis comme clés pour les valeurs du formulaire.id identifie DOM de sorte qu'ils peuvent être ciblés par CSS ou JavaScript.* <em>nom </em>sont également <em>utilisé pour </em>identifier les ancres locales, mais cela n'est plus d'actualité et 'id' est le moyen préféré pour le faire aujourd'hui.
name est le nom qui est utilisé lorsque la valeur est transmise (dans l'URL ou dans les données enregistrées). id est utilisé pour uniquement identifier l'élément pour le style CSS et le JavaScript.
El id peut aussi être utilisé comme une ancre. Dans le temps, <a name a été utilisé pour cela, mais vous devriez utiliser l'option id pour les ancres aussi. name sert uniquement à afficher les données du formulaire.
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
164 votes
@user qui a voté pour fermer cette question comme non constructive :
IDyNameL'utilisation et le comportement sont très bien spécifiés et documentés, les réponses ne peuvent donc être que constructives. Pourquoi ce vote serré alors ? Il en va de même pour les électeurs de -1 ? Qu'est-ce qui ne va pas dans cette question ?