Question

也许答案相对简单，但我刚开始使用Javascript，似乎无法实现我的目标：

我有这段CSS代码：

#tabmenu li a {
background: #ACBACF;
}

现在我想改变背景，但不仅仅是#tabmenu，li或a，而是所有这些。我如何使用Javascript进行此操作？

编辑：这是一个带背景的按钮，我想知道如何更改css部分的值。所以它不仅是背景，还有填充和填充，但为了简单起见，我想说我只想用javascript改变背景。

HTML：

<ul id="tabmenu">
       <li>
           <a href="#index">Home</a>
      </li>
</ul>

编辑2：我无法更改HTML或CSS，因为我想创建一个用户脚本（Greasemonkey）。

Answer 1

我认为直接从Javascript设置css是最好的方法。它会导致很多内联代码，并且与您在外部文件中定义的样式不能很好地协作。如果您要对css进行大量修改，我建议在dom中注入自定义样式标记：

var style = document.createElement("style")
style.setAttribute("type", "text/css");
style.innerHTML = "#tabmenu li a {\
    background: red;\
}";
document.getElementsByTagName("head")[0].appendChild(style)

使用多行字符串值时，Javascript中需要行末尾的“\”。

最后，如果你遵循这条路线，我建议你在文本编辑器中编写css代码，然后用https://csscompressor.net/之类的东西打包（这会给你一个单行字符串）并复制 - 将结果粘贴在括号之间。

Javascript：更改id中的css子节点

1 个答案: