Je suis en train de jouer avec des attributs d'un lien code> lien de code>, il semble y avoir plusieurs façons d'accéder aux attributs:
document.getElementsByTagName("link")[0]['media'] document.getElementsByTagName("link")[0].media document.getElementsByTagName("link")[0].getAttribute('media') document.getElementsByTagName("link")[0].attributes['media']
4 Réponses :
Les deux premières options sont les mêmes. Vous pouvez utiliser soit. Personnellement préférez la version Les deux dernières options dépendent de .Media code> car je pense que cela se lit plus facile. P>
getattribute () code> et
setattribute () code> qui n'ont pas toujours été fiable dans IE. Vous pouvez en lire beaucoup plus sur cela dans le Référence que Matt a posté . En tant que tel, je préfère la version
.Media code> des quatre de vos choix comme la plus fiable et la plus lisible. P>
J'utiliserais .Media code> pour ce cas, car
support code> est en effet une propriété sur l'élément de liaison. Chacun de ceux-ci a son utilisation: p>
['media'] code>: strong> récupère la valeur de la propriété "multimédia" utilisant la notation de support carré. Utilisez la notation de support carré lorsque vous ne connaissez pas le nom de la propriété au moment de la conception. Par exemple, lors de l'itération des propriétés. LI>
.Media code>: strong> récupère la valeur de la propriété "média". J'utiliserais cela dans la plupart des cas. Il fournit un accès concis et direct à la valeur de la propriété. LI>
.getatTtribute ('media') code>: strong> récupère la valeur d'attribut "multimédia". Utilisez-le lorsque vous souhaitez que la valeur d'un attribut qui ne soit pas nécessairement une propriété sur l'élément. Tous les attributs ne sont pas des propriétés et toutes les propriétés ne sont pas des attributs. LI>
.attributes ['media'] code>: strong> récupère le nœud d'attribut "multimédia". Utilisez la collection Attributs lorsque vous avez besoin de plus d'informations sur un attribut que de la valeur. Par exemple, le nom d'attribut. Vous pouvez également utiliser cela facilement pour obtenir la valeur, car
.tostring () code> renvoie la valeur, mais qui peut être surchargée si tout ce que vous voulez est la valeur. Les attributs code> code> sont également utiles pour itérant les attributs d'un élément . Li>
ul>
fonctionnellement, ils sont égaux. P>
performance-sage, les deux premiers sont supérieurs d'un facteur important - bien qu'ils soient tous extrêmement rapides. Voir Ce test JSPERF . P>
Pratiquement parlant, les deux premiers sont plus faciles à lire et ma préférence personnelle est la seconde. (C'est aussi un cheveu plus rapide.) P>
La méthode que vous recherchez est appelée Notez que votre dernier échantillon en théorie Les moyens d'accéder au contenu doivent être équivalents mais les bogues de navigateur ont conduit à un autre comportement en réalité. Il est probablement préférable d'utiliser une couche d'abstraction (une bibliothèque telle que JQuery) pour obtenir un comportement cohérent. Si vous avez l'intention de programmer sans une bibliothèque, le choix dépend de votre goût, mais je dirais que vous alliez via le nœud d'attribut est le plus sûr en général. P> Pour ajouter un détail plus technique, bien que le retour différent de votre retour De même manière la plupart du temps, cela n'est pas nécessairement vrai pour les attributs inexistants. Prenez le HTML suivant comme exemple: Notez que une fois qu'une URI absolue a été renvoyée, une autre fois que la valeur d'origine a été renvoyée. p> getelementsbytagname code>. Il renvoie une liste d'éléments de type tableau (qui n'est pas un tableau).
.attributes ['media'] code> ne renvoie pas une chaîne comme les autres méthodes. Il renvoie un nœud d'attribut à la place. P>
code>. Vous pouvez l'essayer vous-même dans un autre navigateur sur Un test Jsfiddle (la sortie ci-dessous de Firefox). p>
// NamedNodeMap of length 4 and indexes other, href, title, rel, title2 (valid attributes or result of setAttribute in order of creation except those from parsing)
console.log(a.attributes);
Juste une note: les deux premiers compilent à la même chose de la même chose en JavaScript (
.x = ["x"] code> en général), ce n'est pas spécifique aux attributs d'éléments.
C'est
getelementsbytagname code>, pas
getElementyTag code>.
Dupliqué possible de utiliser getattribute () , ou ne pas utiliser getattribute (): c'est la question
... Mais Jslint se plaint de l'utilisation de la notation carré-support lorsque vous n'êtes pas obligé.
Faites-vous référence à document.getelementythaName ()? Si oui, vous voulez vraiment accéder à un tableau de tous les éléments avec ce tagname pour obtenir des attributs spécifiques de tous les éléments sélectionnés. Ou voulez-vous obtenir les attributs d'un seul élément?
Les deux premières ne sont que des différences de syntaxe, pas des différences d'API, et ils vous donnent la propriété i>, qui n'est pas nécessairement la même valeur que l'attribut.
Dupliqué possible de à utiliser getattribute () , ou ne pas utiliser getattribute (): c'est la question