为什么我的 jQuery CSS 修改不起作用？-css教程-PHP中文网

为什么我的 jQuery CSS 修改不起作用？

Susan Sarandon

发布： 2024-12-10 07:19:14

原创

148 人浏览过

Why Doesn't My jQuery CSS Modification Work?

使用 jQuery 更改 CSS

在尝试使用 jQuery 修改 CSS 时，您可能会遇到困难。让我们解决一个常见问题。

问题：

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor":"black","color":"white");
    $(".bordered").css("border", "1px solid black");
}

登录后复制

尽管遵循正确的语法，代码仍无法运行。

答案：

错误源于缺少关闭$("#myParagraph").css() 行中的大括号。正确的代码应该是：

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

登录后复制

此修改会产生一个有效的 JavaScript 函数，该函数成功修改了 CSS 元素。澄清一下，CSS 属性名称符号“backgroundColor”和“background-color”在 jQuery 中都是有效的。 jQuery API 文档证实了这一点。

这里有一个现场演示：http://jsfiddle.net/YPYz8/

完整的工作代码：

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor": "black", "color": "white"});
    $(".bordered").css("border", "1px solid black");
}

登录后复制

此代码片段演示了如何将 h1 元素的背景颜色更改为黄色，该元素的背景颜色为ID“myParagraph”为黑色，该元素中的文本颜色为白色。此外，它还为所有具有“bordered”类的元素添加了 1px 黑色边框。

以上是为什么我的 jQuery CSS 修改不起作用？的详细内容。更多信息请关注PHP中文网其他相关文章！