Element : propriété attributes
Baseline
Large disponibilité
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
La propriété attributes de l'interface Element retourne une collection dynamique de tous les nœuds d'attribut enregistrés pour le nœud défini. Il s'agit d'un objet NamedNodeMap, et non d'un tableau (Array), donc il n'a pas de méthodes Array et les index des nœuds Attr peuvent différer selon les navigateurs. Plus précisément, attributes est une paire clé/valeur de chaînes de caractères représentant toutes les informations concernant cet attribut.
Valeur
Un objet NamedNodeMap.
Exemples
Exemples simples
// Récupère le premier élément <p> du document
const paragraphe = document.querySelector("p");
const attributs = paragraphe.attributes;
Énumérer les attributs d'éléments
Vous pouvez énumérer les attributs d'un élément en utilisant for…of.
L'exemple suivant parcourt les nœuds d'attribut de l'élément du document avec l'ID « paragraphe » et imprime la valeur de chaque attribut.
<p id="paragraphe" class="vert" contenteditable>Exemple de paragraphe</p>
<input
type="button"
value="Afficher le nom et la valeur de l'attribut du paragraphe" />
<pre id="resultat"></pre>
.vert {
color: green;
}
const paragraphe = document.getElementById("paragraphe");
const resultat = document.getElementById("resultat");
const btn = document.querySelector("input[type='button']");
btn.addEventListener("click", () => {
// Tout d'abord, vérifions que le paragraphe comporte bien certains attributs
if (paragraphe.hasAttributes()) {
let sortie = "Attributs du premier paragraphe :\n";
for (const attr of paragraphe.attributes) {
sortie += `${attr.name} -> ${attr.value}\n`;
}
resultat.textContent = sortie;
} else {
resultat.textContent = "Aucun attribut à afficher";
}
});
Spécifications
| Spécification |
|---|
| DOM # dom-element-attributes |
Compatibilité des navigateurs
Voir aussi
- L'interface
NamedNodeMapde l'objet retourné - Considérations de compatibilité entre navigateurs : sur le mode quirks (angl.)