JavaScript 中可以使用 style 对象来操作元素的样式属性。style 对象是元素的一个属性，通过它可以访问和修改元素的内联样式属性。

要访问元素的样式属性，可以使用以下语法：

element.style.property

其中，element 是要操作的元素，property 是要访问或修改的样式属性。

下面是一些常用的样式属性操作方法的详细解析和代码示例：

1. 获取元素的样式属性值

要获取元素的样式属性值，可以使用 style 对象的属性访问方式。例如，要获取元素的背景颜色属性值，可以使用以下代码：

var element = document.getElementById("myElement");
var bgColor = element.style.backgroundColor;
console.log(bgColor); // 输出背景颜色属性值

1. 修改元素的样式属性值

要修改元素的样式属性值，可以使用 style 对象的属性赋值方式。例如，要将元素的背景颜色修改为红色，可以使用以下代码：

var element = document.getElementById("myElement");
element.style.backgroundColor = "red";

1. 动态添加样式属性

要动态添加样式属性，可以使用 style 对象的属性赋值方式。例如，要动态添加一个字体大小属性，可以使用以下代码：

var element = document.getElementById("myElement");
element.style.fontSize = "18px";

1. 动态修改样式属性

要动态修改样式属性，可以使用 style 对象的属性赋值方式。例如，要动态修改元素的字体颜色，可以使用以下代码：

var element = document.getElementById("myElement");
element.style.color = "blue";

1. 删除样式属性

要删除样式属性，可以使用 style 对象的属性赋值方式将属性值设置为空字符串。例如，要删除元素的背景颜色属性，可以使用以下代码：

var element = document.getElementById("myElement");
element.style.backgroundColor = "";

需要注意的是，使用 style 对象只能访问和修改内联样式属性，无法访问和修改外部样式表中定义的样式属性。如果要操作外部样式表中定义的样式属性，可以使用 getComputedStyle 方法来获取计算后的样式属性值，或者通过修改元素的 className 或 classList 属性来应用不同的样式类。