我有一个包含大量样式表的通用CSS。我想使用jquery告诉表我必须忽略“all.css”规则并且只是做它自己的事情。我该如何做到这一点?谢谢大家!
答案 0 :(得分:2)
我建议使用id
覆盖一般的css选择器并填写所有默认样式。
#table {
//default styles
}
答案 1 :(得分:1)
您可以使用:not selector,它现在是CSS3标准。
https://developer.mozilla.org/en-US/docs/Web/CSS/:not
像这样使用:
table:not(.old-style) {
width: 666%;
color: blue;
background-color: red;
}
当然,不要使用这些值:P
答案 2 :(得分:0)
为什么CSS / jQuery可以简单地重写或覆盖规则。
table:not([id="excludeThisTable"])
{
/* style for any table exept #excludeThisTable */
}
我相信jQuery管理这个选择器。 http://api.jquery.com/not-selector/或http://api.jquery.com/not/
我的选择是CSS + polyfill :(时间比jQuery短) 在CSS中更新选择器,为旧浏览器添加polyfill并继续使用其余的
答案 3 :(得分:0)
我会通过告诉样式不适用于你的表(:not operator),或者强制样式仅应用于你想要的元素(不是所有表,但可能是带有类的表)来纠正你的CSS。
这样可行,但这很讨厌:
(function($){
$.fn.getStyleObject = function(){
var dom = this.get(0);
var style;
var returns = {};
if(window.getComputedStyle){
var camelize = function(a,b){
return b.toUpperCase();
}
style = window.getComputedStyle(dom, null);
for(var i=0;i<style.length;i++){
var prop = style[i];
var camel = prop.replace(/\-([a-z])/g, camelize);
var val = style.getPropertyValue(prop);
returns[camel] = val;
}
return returns;
}
if(dom.currentStyle){
style = dom.currentStyle;
for(var prop in style){
returns[prop] = style[prop];
}
return returns;
}
return this.css();
}
})(jQuery);
$(document).ready(function(){
// Disable stylesheets
$('link[rel="stylesheet"]').prop('disabled', true);
// Get current styles
var style=$('#mytable').getStyleObject();
// Enable stylesheets
$('link[rel="stylesheet"]').prop('disabled',false);
// Apply saved styles
$('#mytable').css(style);
});
这是一个jsfiddle:http://jsfiddle.net/nMcyT/
它将引导程序css附加到小提琴上。代码基本上禁用页面上的所有样式表,获取表的当前样式,重新启用样式表,然后将所有保存的样式作为内联样式应用于表。