Question

正如标题所示，我试图使用javascript函数更改我的css背景颜色。为了简化问题，我在这里写了一个新代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Potato</title>

<style>
#item {
    background-color:blue;
    color:red;
}
</style>

<script type="text/javascript">
    function changeBG(id,color) {
        var id = id;
        var color = color;

        document.getElementById(id).style.background-color = color;
    }
</script>
</head>

<body>
<script type="text/javascript">changeBG(item,green)</script>
<div id="item">I am a potato</div>
</body>
</html>

默认背景颜色为红色（由CSS建议），然后我想在打印之前将其更改为绿色。但代码不起作用。我不知道错误在哪里。

Answer 1

首先需要首先item：

<div id="item">I am a potato</div>
<script>
     //...stuff....
</script>

然后我们需要使用字符串：

changeBG("item","green")

最后在JavaScript中我们说backgroundColor以外的background-color。

Answer 2

@media print {
   #item {
    background-color:green;
   }
}

将此信息包含在您的CSS中。这将在打印时解决您的问题。

Answer 3

javascript中的所有css属性都是camelCased而不是脊柱

document.getElementById('youElement').style.backgroundColor = 'color';

Answer 4

使用jQuery

$("#item").css("background-color", "green");

Documentation

或纯JavaScript

document.getElementById("item").style.backgroundColor = "green";

Documentation

使用Javascript更改CSS背景颜色

4 个答案: