Maison  >  Article  >  interface Web  >  Introduction aux différences entre nom, identifiant et classe en HTML

Introduction aux différences entre nom, identifiant et classe en HTML

黄舟
黄舟original
2017-07-19 11:57:052923parcourir

Dans une page, il existe de nombreux contrôles (éléments ou labels). Afin de faire fonctionner ces balises plus facilement, il est nécessaire de marquer ces balises avec une balise d'identité.

Répertoire

1. nom : Précisez le nom du label.

2. id : Spécifiez l'identifiant unique du tag.

3. classe : Spécifiez le nom de classe de l'étiquette.

1. nom

Précisez le nom de l'étiquette.

Format 1.1

<input type="text" name="username" />

1.2 Scénario d'application

①formulaire : le nom peut être utilisé comme nom de variable à transmettre la liste des formulaires du serveur ; Par exemple, le nom transmis au serveur ci-dessus est : username='text value'.

②input type='radio' radio tag : Lorsque les noms de plusieurs radio tags sont définis sur la même valeur, une opération de sélection radio sera effectuée.


<input type="radio" name=&#39;sex&#39;/>男<input type="radio" name=&#39;sex&#39;/>女

③ Obtenez rapidement un groupe de balises du même nom : obtenez des balises du même nom et effectuez des opérations ensemble, telles que : modifier les attributs, s'inscrire à des événements, etc.


function changtxtcolor() {    var txts = document.getElementsByName(&#39;txtcolor&#39;); //获取所有name=txtcolor 的标签
    for (var i = 0; i < txts.length; i++) { //循环遍历标签,并把背景色改为red
        txts[i].style.backgroundColor = &#39;red&#39;;
    }
}

1.3 Fonctionnalités

La valeur de l'attribut name n'est pas unique dans la page actuelle.

2. id

précise l'identifiant unique de la balise.

Format 2.1

<input type=password 
id
="userpwd" />


2.2 Scénario d'application

①Tel que fourni Le numéro d'identification unique pour obtenir rapidement l'objet étiquette. Par exemple : document.getElementById(id)

② Utilisé comme valeur de l'étiquette pour l'attribut : Exemple : d305c5282d143dd49e6374acc3c8c7aa /label> ; signifie que lorsque l'on clique sur cette étiquette, l'étiquette avec l'ID utilisateur obtient le focus.

2.3 Fonctionnalités

La valeur de l'attribut id doit être unique dans la page actuelle.

3. class

Spécifie le nom de classe de l'étiquette.

Format 3.1

<input type=button 
class
="btnsubmit" />


3.2 Scénario d'application

① Opération CSS, mettez certains styles spécifiques dans une classe Si vous avez besoin de balises de ce style, vous pouvez ajouter cette classe.

3.3 Fonctionnalités

Vous pouvez mettre plusieurs classes dans un attribut de classe, mais elles doivent être séparées par des espaces tels que :  ;

class
=
&#39;btnsubmit btnopen&#39;


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn