Quelles sont les valeurs valides pour l'attribut id dans le HTML?

Question

Lors de la création de l' id attributs pour les éléments HTML, quelles sont les règles qui sont là pour la valeur?

Answer 1

Pour HTML 4, la réponse est techniquement:

L'ID et le NOM de jetons doit commencer par une lettre ([A-Za-z]) et peut être suivi d'un nombre quelconque de lettres, de chiffres ([0-9]), des tirets ("-"), des traits de soulignement ("_"), deux-points ( " :") et des points (".").

HTML 5 est encore plus permissive, disant seulement qu'une pièce d'identité doit contenir au moins un caractère et ne peuvent contenir aucun des caractères d'espacement.

Cependant, en pratique, vous allez être un peu plus limitée si vous voulez que vos documents de travailler avec une variété de navigateurs, CSS éditeurs, et des frameworks JavaScript.

Comme indiqué dans d'autres réponses, jQuery a des problèmes avec des id qui contiennent les périodes et les deux-points.

Un problème plus subtil, c'est que certains navigateurs traiter l'attribut id de valeurs sensibles à la casse, alors que les autres navigateurs ne le font pas. Cela signifie que si vous tapez id="firstName" dans votre code HTML (bas-de-casse "f") et #FirstName { color: red } dans votre CSS (en majuscule, 'F'), un buggy navigateur va définir l'élément de couleur rouge. Parce que les deux définitions d'utiliser des caractères valides pour les id, vous ne recevez aucun message d'erreur à partir d'un outil de validation.

Vous pouvez éviter ces problèmes en strictement s'en tenir à une convention de nommage. Par exemple, si vous vous limitez entièrement en caractères minuscules et toujours des mots distincts, soit des traits d'union ou des traits de soulignement (mais pas les deux, choisissez-en un et de ne jamais utiliser les autres), alors vous avez un facile à retenir modèle. Vous n'aurez plus jamais me demande "est-ce firstName ou FirstName?" parce que vous saurez toujours ce que vous tapez first_name.

Answer 2

À partir de la spécification HTML 4:

L'ID et le NOM de jetons doit commencer par une lettre ([A-Za-z]) et peut être suivi d'un nombre quelconque de lettres, de chiffres ([0-9]), des tirets ("-"), des traits de soulignement ("_"), deux-points ( " :") et des points (".").

Une erreur commune est d'utiliser un ID qui commence par un chiffre.

Answer 3

Vous pouvez utiliser techniquement des virgules et des périodes id/attributs de nom, mais je suggère fortement d'éviter à la fois.

Dans le CSS (et plusieurs bibliothèques JavaScript comme jQuery), la période et le côlon ont une signification spéciale et vous allez rencontrer des problèmes si vous ne faites pas attention. Les périodes sont des sélecteurs de classe et les deux-points sont des pseudo-sélecteurs (eg., ":hover" pour un élément lorsque la souris est dessus).

Si vous donner un élément de l'id de "mon.cool:chose", votre sélecteur CSS ressemble à ceci:

#my.cool:thing { ... /* some rules */ ... }

Ce qui est vraiment en disant: "l'élément dont l'id est "mon", une catégorie de "cool" et de la "chose" pseudo-sélecteur" dans les CSS-parler.

Bâton de A-Z de tous les cas, des chiffres, des traits de soulignement et des traits d'union. Et comme l'a dit ci-dessus, assurez-vous que vos identifiants sont uniques.

Que devrait être votre première préoccupation.

Answer 4

jQuery ne poignée d'une pièce d'identité valide nom. Vous avez juste besoin d'échapper les caractères de remplacement (c'est à dire, des points, points-virgules, crochets...). C'est comme dire que JavaScript a un problème avec les citations seulement parce que vous ne pouvez pas écrire

var name = 'O'Hara';

Les sélecteurs de jQuery API (voir en bas de note)

Answer 5

Strictement, il devrait correspondre à

[A-Za-z][-A-Za-z0-9_:.]*

Mais jquery semble avoir des problèmes avec des points de sorte qu'il peut être préférable de les éviter.