Maison >interface Web >js tutoriel >Puis-je accéder aux éléments DOM par ID en tant que propriétés globales, et dois-je le faire ?

Puis-je accéder aux éléments DOM par ID en tant que propriétés globales, et dois-je le faire ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-21 13:25:13455parcourir

Can I Access DOM Elements by ID as Global Properties, and Should I?

Éléments DOM attribués par ID et propriétés globales

Dans une question précédente, il a été observé que des éléments DOM spécifiques avec des ID sont accessibles en tant que variable noms ou propriétés de l'objet window dans Internet Explorer et Chrome. Par exemple, pour l'élément HTML :

<div>

La propriété innerHTML peut être récupérée comme suit :

alert(example.innerHTML); // Alerts "some text".
alert(window["example"].innerHTML); // Alerts "some text".

Cela soulève les questions :

  • Sont tous les éléments DOM avec des ID convertis en propriétés d'objet globales ?
  • Ce mécanisme peut-il être utilisé comme alternative au getElementById méthode ?

Propriétés et accessibilité globale

Le comportement prévu est que les éléments nommés deviennent des propriétés apparentes de l'objet document. Cependant, cette approche est problématique car elle permet aux noms d'éléments d'entrer en conflit avec les propriétés réelles du document.

Microsoft Internet Explorer a exacerbé le problème en attribuant des éléments nommés comme propriétés de l'objet fenêtre. Cela complique encore les choses en exigeant d'éviter les noms d'éléments qui correspondent à n'importe quel membre du document ou de l'objet fenêtre.

Problèmes d'accessibilité globale

De plus, les éléments nommés deviennent visibles comme variables de type global. Bien que les déclarations de variables globales et de fonctions les éclipsent généralement, l'attribution d'une valeur à une variable globale avec un nom correspondant peut entraîner des erreurs dans Internet Explorer.

Bonnes pratiques

Il Il est généralement déconseillé de s'appuyer sur des éléments nommés comme propriétés globales ou d'omettre la déclaration var lors de la création de variables globales. Il est recommandé d'adhérer à document.getElementById en raison de sa prise en charge plus large et de sa réduction de l'ambiguïté. Pensez à utiliser une simple fonction wrapper avec un nom plus court si la saisie devient un problème.

Mise en cache et optimisation du navigateur

La maintenance d'un cache de recherche d'identifiant à élément est généralement inutile car les navigateurs optimisent souvent l'appel getElementById à l'aide d'une recherche rapide. Des problèmes potentiels surviennent lorsque des éléments changent d'identifiant ou sont ajoutés/supprimés du document.

Standardisation et implications futures

La spécification HTML5 codifie désormais la pratique auparavant non standard de ajout d'éléments nommés aux propriétés du document et de la fenêtre. Cela signifie que Firefox 4 prendra également en charge cette fonctionnalité.

Conclusion

Bien qu'il soit possible d'accéder aux éléments DOM avec des ID comme propriétés globales dans certains navigateurs, cette pratique est découragé en raison de conflits potentiels et d’ambiguïtés. Il est préférable de s'appuyer sur document.getElementById ou sur une simple fonction wrapper.

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