添加style属性 js

```javascript

var element = document.getElementById("example");

```

接下来，我们可以通过element.style来设置元素的样式。例如，我们可以通过以下代码将元素的背景颜色设置为红色：

```javascript

element.style.backgroundColor = "red";

```

同样地，我们也可以设置元素的其他样式，比如文字颜色、字体大小等。下面是一些常见的样式设置示例：

```javascript

// 设置文字颜色为蓝色

element.style.color = "blue";

// 设置字体大小为20px

element.style.fontSize = "20px";

// 设置元素的宽度和高度

element.style.width = "100px";

element.style.height = "100px";

// 设置元素的边框样式

element.style.border = "1px solid black";

```

除了直接设置样式属性之外，我们还可以通过style.cssText属性来一次性设置多个样式。例如，以下代码可以同时设置文字颜色、背景颜色和边框样式：

```javascript

element.style.cssText = "color: blue; background-color: red; border: 1px solid black;";

```

通过JavaScript添加style属性可以使我们实现一些动态的效果，比如根据用户操作改变元素的样式、根据特定条件修改元素的外观等。同时，使用这种方法可以使我们的前端开发更加灵活和可控，有助于提升用户体验和页面的交互性。希望以上内容能帮助您更好地了解如何通过JavaScript添加style属性来修改元素的样式。