如何使用jQuery更改CSS？

Question

我正在尝试使用jQuery更改CSS：

$(init);

    

function init() {

    $("h1").css("backgroundColor", "yellow");

    $("#myParagraph").css({"backgroundColor":"black","color":"white");

    $(".bordered").css("border", "1px solid black");

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

<div class="bordered">

    <h1>Header</h1>

    <p id="myParagraph">This is some paragraph text</p>

</div>

我在这里想念什么？

Answer 1

您可以执行以下任一操作：$("h1").css("background-color", "yellow");要么：$("h1").css({backgroundColor: "yellow"});

Answer 2

由于有些答案提供了不正确的信息，因此需要进行一些整理：jQuery .css（）方法在许多情况下允许使用DOM或CSS表示法。所以，无论是backgroundColor和background-color将完成这项工作。另外，当您.css()使用参数调用时，关于参数可以有两种选择。它们可以是2个以逗号分隔的字符串，表示一个CSS属性及其值，也可以是一个Javascript对象，其中包含一个或多个CSS属性和值的键值对。总之，您的代码唯一的错误是缺少代码}。该行应显示为：$("#myParagraph").css({"backgroundColor":"black","color":"white"});你不能离开大括号，但是你可以离开了引号各地backgroundColor和color。如果使用background-color，则必须使用双引号将其引起来。通常，引用Javascript对象是一个好习惯，因为如果不引用现有关键字，就会出现问题。最后一点是关于jQuery .ready（）方法的信息$(handler);是同义的搭配：$(document).ready(handler);以及第三种不推荐的形式。这意味着$(init)完全正确，因为init在该实例中是处理程序。因此，init在构建DOM时将被触发。