HTMLElement: attributeStyleMap-Eigenschaft
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
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
| Specification |
|---|
| CSS Typed OM Level 1 # dom-elementcssinlinestyle-attributestylemap |
Browser-Kompatibilität
Loading…