HTMLElement : propriété attributeStyleMap
Limited availability
Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.
La propriété en lecture seule attributeStyleMap de l'interface HTMLElement retourne un objet StylePropertyMap dynamique qui contient la liste des propriétés de style de l'élément définies dans l'attribut style en ligne, ou assignées via la propriété style de l'interface HTMLElement par script.
Les propriétés abrégées sont développées. Si vous définissez border-top: 1px solid black, les propriétés détaillées (border-top-color, border-top-style et border-top-width) sont définies à la place.
La principale différence entre la propriété style et la propriété attributeStyleMap est que la propriété style retourne un objet CSSStyleDeclaration, tandis que la propriété attributeStyleMap retourne un objet StylePropertyMap.
Bien que la propriété elle-même ne soit pas modifiable, vous pouvez lire et écrire les styles en ligne via l'objet StylePropertyMap qu'elle retourne, tout comme avec l'objet CSSStyleDeclaration retourné par la propriété style.
Valeur
Un objet StylePropertyMap dynamique.
Exemples
L'extrait de code suivant montre la relation entre l'attribut style et la propriété attributeStyleMap :
<div id="el" style="border-top: 1px solid blue; color: red;">
Un élément d'exemple
</div>
<div id="output"></div>
#el {
font-size: 16px;
}
#output {
white-space: pre-line;
}
const element = document.getElementById("el");
const output = document.getElementById("output");
for (const property of element.attributeStyleMap) {
output.textContent += `${property[0]} = ${property[1][0].toString()}\n`;
}
Spécifications
| Specification |
|---|
| CSS Typed OM Level 1 # dom-elementcssinlinestyle-attributestylemap |
Compatibilité des navigateurs
Voir aussi
- La propriété
HTMLElement.style - La propriété
SVGElement.attributeStyleMap - La propriété
MathMLElement.attributeStyleMap