在类中使用JQuery更改CSS规则 [英] Change CSS rule in class using JQuery

问题描述

我在CSS中有一个类

.Foo
{
  width:20px;
}

使用Jquery我想对事件做类似的事情： / p>

Using Jquery I would like to do something similar to this on an event:

$(".Foo").css("width", "40px");

这不起作用。这是错误的方法吗？我应该使用addClass（）和removeClass（）？

This doesn't work. Is this the wrong approach? Should I use addClass() and removeClass()?

编辑：我想出了我的问题。这个命令实际上是工作。在我的特定应用程序中，我没有使用类创建元素，在我使用命令之前，所以当他们创建没有什么改变。

I figured out my problem. This command does in fact work. In my particular application I hadn't created the elements using the class before I used the command, so when they were created nothing was changed.

基本上，此命令不会更改CSS样式规则，只是使用类的元素。

Basically this command doesn't change the CSS style rule, just the elements using the class.

推荐答案

jQuery.css 会找到在页面上具有 Foo 类的所有现有元素，然后设置其内联样式 width 到 40px 。

jQuery.css will find all existing elements on the page that have the Foo class, and then set their inline style width to 40px.

换句话说，更改css规则 - 如果你动态添加一个元素与 Foo 类，它仍然会有一个宽度 20px ，因为其内联样式未设置为覆盖默认CSS规则。

In other words, this doesn't create or change a css rule -- if you dynamically add an element with the Foo class, it would still have a width of 20px, because its inline style hasn't been set to override the default CSS rule.

而应使用 addClass 和 removeClass 并控制静态CSS中的样式。

Instead, you should use addClass and removeClass and control the styles in your static CSS.

这篇关于在类中使用JQuery更改CSS规则的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！