CSSStyleDeclaration

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨julio de 2015⁩.

Resúmen

CSSStyleDeclaration representa una colección CSS de pares propiedad-valor. Se utiliza en unas cuantas APIs:

HTMLElement.style - para manipular el estilo de un solo elemento (<elem>);
En otras palabras, es un interface para losbloques de declaraciones devueltos por la propiedadstyle de unaregla CSS en unahoja de estilos, cuando la regla es unaCSSStyleRule.
CSSStyleDeclaration es también un interface desólo-lectura para el resultado dewindow.getComputedStyle().

Atributos

CSSStyleDeclaration.cssText: Representación textual del bloque de declaración. Estableciendo este atributo cambia el estilo.
CSSStyleDeclaration.length: El número de propiedades. Ver el método delelemento inferior.
CSSStyleDeclaration.parentRule: El contenedorCssRule.

Métodos

CSSStyleDeclaration.getPropertyPriority(): Retorna la prioridad opcional, "important". Ejemplo:priString=styleObj.getPropertyPriority('color')
CSSStyleDeclaration.getPropertyValue(): Retorna el valor de la propiedad. Ejemplo:valString=styleObj.getPropertyValue('color')
CSSStyleDeclaration.item(): Retorna un nombre de propiedad. Ejemplo:nameString=styleObj.item(0) Alternative:nameString=styleObj[0]
CSSStyleDeclaration.removeProperty(): Retorna el valor borrado. Ejemplo:valString=styleObj.removeProperty('color')
CSSStyleDeclaration.setProperty(): Sin retorno. Ejemplo:styleObj.setProperty('color', 'red', 'important')
CSSStyleDeclaration.getPropertyCSSValue(): Solo soportado a través de getComputedStyle. Devuelve unROCSSPrimitiveValue en Firefox (CSSPrimitiveValue, en otros, los cuales implementanCSSValue), o nulo paraPropiedades taquigráficas. Ejemplo:cssString= window.getComputedStyle(elemento,null).getPropertyCSSValue('color').cssText;Observación: Gecko 1.9 devuelvenull a menos que se utilicegetComputedStyle().Observación: Este método puede estardesaconsejado por el W3C , y no está presente en el últimoborrador CSSOM. No está soportado por IE e incluso aunque la función existe en Opera, llamarla lanza una excepciónDOMException NOT_SUPPORTED_ERR.

Ejemplo

var styleObj = document.styleSheets[0].cssRules[0].style;alert(styleObj.cssText);for (var i = styleObj.length - 1; i >= 0; i--) {  var nameString = styleObj[i];  styleObj.removeProperty(nameString);}alert(styleObj.cssText);

El bloque de declaración es esa parte de la regla de estilo que aparece dentro de las llaves ({}) y que actualmente proporciona las definiciones de estilo (para el selector, la parte que precede a las llaves).