有没有办法用jQuery改变CSS类的属性,而不是元素的属性?
这是一个实际的例子:
我有一个类为red
的div
.red {background: red;}
我想要更改类red
背景属性,而不是指定了类red
背景的元素。
如果我用jQuery .css() method这样做
$('.red').css('background','green');
它将影响当前具有类red
的元素。到这里为止,一切都很好。但是如果我调用Ajax,并使用red
类插入更多的red
,这些div的背景将不是绿色的,而是初始的div背景。
我可以再给jQuery .css() method打电话。但是我想知道是否有一种方法可以改变类本身。请考虑这只是一个基本的例子。
发布于 2013-11-07 09:36:36
如果不能通过动态加载来使用不同的样式表,可以使用此函数修改CSS类。希望它能帮到你。
function changeCss(className, classValue) {
// we need invisible container to store additional css definitions
var cssMainContainer = $('#css-modifier-container');
if (cssMainContainer.length == 0) {
var cssMainContainer = $('<div id="css-modifier-container"></div>');
cssMainContainer.hide();
cssMainContainer.appendTo($('body'));
}
// and we need one div for each class
classContainer = cssMainContainer.find('div[data-class="' + className + '"]');
if (classContainer.length == 0) {
classContainer = $('<div data-class="' + className + '"></div>');
classContainer.appendTo(cssMainContainer);
}
// append additional style
classContainer.html('<style>' + className + ' {' + classValue + '}</style>');
}
此函数将接受任何类名,并用新值替换任何先前设置的值。注意,您可以通过向classValue:"background: blue; color:yellow"
传递以下内容来添加多个值。
发布于 2013-07-23 18:22:17
您可以动态删除类和添加类
$(document).ready(function(){
$('#div').removeClass('left').addClass('right');
});
发布于 2013-11-07 11:09:04
您可以向红色div的父级添加一个类,例如绿色样式
$('.red').parent().addClass('green-style');
然后将样式添加到css
.green-style .red {
background:green;
}
所以每次你在绿色样式下添加红色元素时,背景都是绿色的
https://stackoverflow.com/questions/11474430
复制相似问题