Une brève discussion sur la différence entre l'identifiant et le nom dans l'exemple HTML code_Experience Exchange

Nous pouvons analyser les différences subtiles grâce à un morceau de code :

dans le navigateur IE Combien méthodes pouvons-nous utiliser pour indexer cet objet zone de texte ? (Par souci de distinction, nous définissons NAME et ID sur des valeurs différentes)
1. oDemo
2 demoform.oDemo
3. .oDemo
5. document.forms[0].oDemo
6. document.forms['demoform'].oDemo
7. >8. document.forms['demoform'].elements[0]
9. document.getElementById('oDemo2')

Les 9 méthodes d'indexation ci-dessus ont toutes réussi le test de valeur de retour dans IE6. , il convient de noter le dernier : dans IE6, j'ai écrit l'objet d'index sous la forme

document.getElementById('oDemo'), et le navigateur peut indexer l'objet correctement. C'est une tolérance aux pannes vraiment terrible ! !

Ensuite, le problème survient. Nous mettons ce code dans Mozilla Firefox 1.0 et l'exécutons à nouveau. Seule la 7ème méthode renvoie "undefined", et d'autres méthodes peuvent correctement

indexer l'objet. , étant donné que les troisième et quatrième méthodes utilisent l'objet document.all spécifique à IE, bien que FF1.0 ait renvoyé la valeur correcte, il a émis un avertissement

dans la console : Avertissement : propriétés standard non autorisées document.all. Veuillez utiliser le formulaire standard du W3C document.getElementById() .

Ensuite, nous définissons le type de texte HTML plus strictement et ajoutons au début du code source :



nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">afin que le texte HTML soit analysé en fonction de Selon la norme HTML4.01, dans IE6, tous les tests de valeur de retour réussissent toujours, mais dans Mozilla Firefox 1.0, le problème est grand. Les troisième et quatrième méthodes

n'ont aucune valeur de retour, mais un message d'erreur est affiché. émis dans la console : Erreur : document.all n'a pas de propriétés et la 7ème méthode renvoie toujours "undefined

".

Résumé

name était à l'origine utilisé pour l'identification, mais maintenant, selon la spécification, il est recommandé d'utiliser id pour identifier les éléments.

Seul le nom peut être utilisé dans les cas suivants :
1. Le nom du contrôle du formulaire et les données soumises sont contrôlées par le nom du contrôle au lieu de l'identifiant. Parce qu'il existe de nombreux noms qui correspondent à plusieurs contrôles en même temps, tels que

case à cocher et radio, et l'identifiant doit être unique dans tout le document. De plus, le navigateur définira la demande envoyée au serveur en fonction du nom. Par conséquent, si l’ID est utilisé, le serveur ne peut pas obtenir les données. ​
2. Les noms de cadres et de fenêtres sont utilisés pour spécifier des cibles dans d'autres cadres ou fenêtres.

Seuls les identifiants peuvent être utilisés pour les éléments suivants :
1. L'association entre l'étiquette et le contrôle de formulaire,

Mon entrée

Le pour L'attribut spécifie l'association avec l'étiquette. L'identifiant de l'élément ne peut pas être remplacé par son nom.​ 2. Le mécanisme de sélection d'élément de CSS utilise #MyId pour spécifier l'élément auquel le style doit être appliqué et ne peut pas être remplacé par son nom.
3. Obtention de l'objet dans le script :
IE prend en charge le référencement direct de l'objet identifié par l'identifiant (au lieu du nom) dans le script. Par exemple, pour l'entrée ci-dessus, si vous souhaitez obtenir le contenu de l'entrée dans le script, vous pouvez l'obtenir directement avec

MyInput.value.
Si vous utilisez DOM, utilisez document.getElementById("MyInput").value. Si vous souhaitez utiliser le nom, vous obtenez généralement le formulaire contenant le contrôle en premier, tel que

document.forms[0. ], puis ensuite le nom de référence du formulaire. Notez que la valeur ainsi obtenue est la valeur qui sera envoyée au serveur après calcul.

Les autres différences entre le nom et l'identifiant sont :
L'identifiant doit être conforme aux exigences d'identification, telles que le respect de la casse, et il est préférable de ne pas inclure de traits de soulignement (car il n'est pas compatible avec CSS). Il n'y a fondamentalement aucune exigence concernant le nom, vous pouvez même utiliser des chiffres

.

Utilisez CSS pour contrôler le style de maintien de ce lien
Vous pouvez écrire comme ceci #m_blog div.opt a:hover{color:#D57813} ou #myLink:hover{color:#D57813}.

NAME est principalement utilisé dans les pages Web interactives. Le formulaire est soumis à un script côté serveur et reçoit un volume de traitement variable. Du point de vue de la standardisation et de la compatibilité du code source, si vous souhaitez indexer un objet dans le script client

, il est recommandé d'utiliser la méthode document.getElementById(). Essayez de ne pas utiliser directement la valeur NAME. Bien sûr, si ce n'est compte tenu de la compatibilité, les 9 méthodes ci-dessus

peuvent toutes fonctionner sous IE (IE5.0 n'a pas été testé).

Joindre : Code source du test



nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">