HTMLElement: attributeStyleMap-Eigenschaft
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more support for this feature? Tell us why.
Die schreibgeschützte attributeStyleMap-Eigenschaft des HTMLElement-Interfaces gibt ein lebendiges StylePropertyMap-Objekt zurück, das eine Liste von Stil-Eigenschaften des Elements enthält, die im Inline-style-Attribut des Elements definiert sind oder über die style-Eigenschaft des HTMLElement-Interfaces per Skript zugewiesen wurden.
Kurzhand-Eigenschaften werden erweitert. Wenn Sie border-top: 1px solid black setzen, werden die Langhandeigenschaften (border-top-color, border-top-style und border-top-width) stattdessen festgelegt.
Der Hauptunterschied zwischen der style-Eigenschaft und der attributeStyleMap-Eigenschaft besteht darin, dass die style-Eigenschaft ein CSSStyleDeclaration-Objekt zurückgibt, während die attributeStyleMap-Eigenschaft ein StylePropertyMap-Objekt zurückgibt.
Obwohl die Eigenschaft selbst nicht beschreibbar ist, können Sie Inline-Stile durch das StylePropertyMap-Objekt, das sie zurückgibt, lesen und schreiben, genau wie durch das CSSStyleDeclaration-Objekt, das über die style-Eigenschaft zurückgegeben wird.
Wert
Ein lebendiges StylePropertyMap-Objekt.
Beispiele
Der folgende Codeausschnitt zeigt die Beziehung zwischen dem style-Attribut und der attributeStyleMap-Eigenschaft:
<div id="el" style="border-top: 1px solid blue; color: red;">
An example element
</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`;
}
Spezifikationen
| Spezifikation |
|---|
| CSS Typed OM Level 1 # dom-elementcssinlinestyle-attributestylemap |