Propiedad style del elemento HTML DOM

Definición y uso

style propiedad devuelve el valor de la propiedad style del elemento, como objeto CSSStyleDeclaration.

El objeto CSSStyleDeclaration contiene todas las propiedades de estilo en línea del elemento. No contiene en <head> cualquier propiedad de estilo establecida en cualquier hoja de estilo externa o interno.

Punto 1

No puede establecer estilos como estos：

element.style = "color:red";

Debe usar propiedades CSS como estas：

element.style.backgroundColor = "red";

Prueba por tu cuenta

Punto 2

La sintaxis de JavaScript es ligeramente diferente a la de CSS：

backgroundColor / background-color

Vea también nuestra Manual completo del objeto Style。

Punto 3

Utilice esta propiedad style en lugar de Método setAttribute()para evitar sobrescribir otras propiedades en la propiedad style.

Véase también：

Tutoriales de CSS

Manual de referencia de CSS

Objeto Style

Etiqueta <style> de HTML

Ejemplo

Ejemplo 1

Cambiar el color de "myH1":

document.getElementById("myH1").style.color = "red";

Prueba por tu cuenta

Ejemplo 2

Obtener el valor del borde superior de "myP":

let value = document.getElementById("myP").style.borderTop;

Prueba por tu cuenta

Sintaxis

Retornar la propiedad style：

element.style.property

Establecer la propiedad style：

element.style.property = value

Valor de propiedad

Valor Descripción
value

especificar el valor de una propiedad.

Por ejemplo：

element.style.borderBottom = "2px solid red"

Valor de retorno

Tipo Descripción
Objeto el objeto CSSStyleDeclaration del elemento.

Compatibilidad del navegador

element.style es una característica de DOM Level 2 (2001).

Todos los navegadores lo admiten completamente：

Chrome IE Edge Firefox Safari Ópera
Chrome IE Edge Firefox Safari Ópera
Soporte 9-11 Soporte Soporte Soporte Soporte