javascript - 使用 jQuery 更改 CSS 规则定义

Question

假设您要更改许多元素的宽度，例如模拟表格。我知道你可以这样做:

$(".class").css('width', '421px');

这改变了内联 style='width: 421px;' 每个元素的属性。现在，我想做的是:更改实际的 CSS 规则定义:

.class {
    width: 375px;  ==[change to]==> 421px;
}

当涉及到 100 甚至 1000 的嵌套时 <ul>和 <li>需要更改，这似乎比让 jQuery 通过 .css() 来完成工作更能提高性能。方法。

我找到了 this example - 这就是我想要做的:

var style = $('<style>.class { width: 421px; }</style>')
$('html > head').append(style);

我并没有尝试交换类 ( $el.removeClass().addClass() )，因为我无法为每个最佳宽度(379px、387px、402px..)创建一个类。

我可以创建一个 <style>元素并动态设置宽度，但我认为有更好的方法。

Answer 1

document.styleSheets[0].addRule 在 Chrome 中有效，在 FF 中“不是函数”