使用 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中文网其他相关文章!