如何使jQuery的$（元素）.css（）持久性的影响？

例如，字体大小切换器/按钮，如果我用

$('#container p').css('font-size', '24px');

它按预期工作，但如果我稍后添加段落元素到容器（通过AJAX，等等），它们不是风格的与更新的字体大小。我知道这是.css()方法的预期行为。我只是问：

什么是正确的方法来改变一个CSS选择器的风格，并使这些风格持久？

来源

2011-02-02 anonymous coward

我正在选择Alexsander Akers的回答，这个**警告**：如果需要样式的持久性，并且所有元素*可能不在相同容器中，则添加/删除样式表对象可能是最好的选择。 **但是**，在所有元素都在同一个父元素中的情况下，应该通过`toggleClass（）`或`addClass（）方法创建一个样式/类定义并在**父/容器**上进行切换。 `/`removeClass（）`。 – 2011-02-04 19:26:10

没错，当你执行该命令时，它会在#container中设置所有p元素。如果你希望它是永久的，你可以创建一个<style />元素并在那里添加CSS样式。

要详细，你可以做这样的事情：

$(document.head).append('<style>#container p{font-size: 24px;}</style>');

来源

2011-02-02 01:30:35

这是可以接受的情况下，用户可以切换样式？ – 2011-02-02 02:00:48

我想最好的做法是创建多个样式规则，并简单地切换父/容器元素上的类。我只是认为jQuery可能会为您处理全局规则更改。谢谢！ – 2011-02-02 02:20:40

为我工作$（''） .appendTo（'head'） .html（'div.myClass {background：yellow;}'）; – molokoloco 2011-10-15 01:23:55

那么你要添加的风格元素退出只，有没有办法让jQuery来了解新的元素。

来源

2011-02-02 01:31:21 Victor

我同意。希望它能够成为一个清晰的例子，说明我的预期效果是否清晰。感谢您的输入！ – 2011-02-02 01:59:08

jQuery不会在该行什么是等价于：

<div id='container'> 
    <p style='font-size:24px'>a</p> 
    <p style='font-size:24px'>b</p> 
    <p style='font-size:24px'>c</p> 
</div>

您的特定情况下，我会得到本文档中的样式之一，是这样的：

var stylesheets = document.styleSheets

它返回一个包含insertRule方法的styleSheet objects数组，您可以使用它来添加新的（永久）css规则。

干杯！

来源

2011-02-02 01:32:07

请注意，`insertRule（）`是Firefox特定的。尝试[jQuery.Rule插件]（http://flesler.blogspot.com/2007/11/jqueryrule.html）以实现跨浏览器兼容性。 – Orbling 2011-02-02 01:37:20

你不能直接添加的风格瓦特/ JavaScript的，但却可以做到这一点：

<div id="wrapper"> 
    <div id="paragraph1">blah</div> 
    <div id="paragraph2">you</div> 
</div>

和

$("#wrapper").css...

这样你添加到包装纸上的任何一款都会有新的字体大小...

来源

2011-02-02 01:33:49 JCOC611

问题可能是你正在破坏你有风格的元素。

如果您通过AJAX引入#container的替代品，则所有内容都将被销毁并替换为新内容。您添加样式的所有<p>标签将不再存在，并且需要在新条目中重复。你可以尝试创建一个class definition on the fly。

来源

2011-02-02 01:36:09 Orbling

如何使jQuery的$（元素）.css（）持久性的影响？

回答

相关问题