JavaScript 是一门非常强大的程序语言，它允许我们可以对页面进行动态操作。其中，它对页面的样式控制能力越来越强，不仅可以动态修改页面中已有元素的样式属性，还能动态添加样式。

我们可以使用 JS 添加样式的方法是通过新增 CSS 属性。新增 CSS 属性的方法主要有两种，一种是使用 JavaScript 内部样式对象，另一种是使用 style 属性。

// 用内部样式对象添加样式
var divEle = document.getElementById("divId");
divEle.style.color = "red";
divEle.style.fontSize = "20px";
// 用 style 属性添加样式
var pEle = document.getElementById("pId");
pEle.setAttribute("style", "color:red; font-size:20px;");

这些代码表明，我们可以使用 JS 动态添加 CSS 样式，不仅可以实时调试与测试，还可以根据不同情况创建出不同样式的界面效果，还能提高我们的编程效率。

除了能够通过 JS 新增样式属性之外，还可以新增样式表。新增样式表主要使用的是 JS 中的document.createElement("style")方法，然后通过style.sheet.insertRule方法将样式插入到样式表中。

// 新增样式表
var styleEle = document.createElement("style");
document.head.appendChild(styleEle);
// 插入样式
var sheet = styleEle.sheet;
sheet.insertRule("div{color:red; font-size:20px}", 0);

通过 JS 添加样式表不仅可以实现动态样式，还可以针对不同的页面进行不同风格的编写，极大提高了页面的可复用性和可维护性。