jQuery：检查元素是否具有 CSS 属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2239567/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery: check if element has CSS attribute
提问by adamyonk
Is there a way to check an elements parents and find the first one that has a CSS background set and then return that background value?
有没有办法检查元素的父元素并找到第一个设置了 CSS 背景的元素，然后返回该背景值？
Something like:
就像是：
var background = $('element').parents().has(css('background'));
UPDATE: This is the code I'm now using:
更新：这是我现在使用的代码：
jQuery.fn.getBg = function(){
var newBackground = this.parents().filter(function() {
return $(this).css('background-color').length > 0;
}).eq(0).css('background-color');
$(this).css('background-color',newBackground); console.log("new background is: "+newBackground);
};
回答by dxh
If it's not set, fetching it will yield an empty string. Hence
如果未设置，则获取它会产生一个空字符串。因此
var bg = ('element').parents().filter(function() {
return $(this).css('background').length > 0;
}).eq(0)
EDIT
编辑
Some research shows that css('background')will alwaysyield an empty string, or undefined, depending on browser. css('background-color')will correctly return the color of the element at hand; but also different values for each browser, so it is troublesome to test (transparentin IE, rgba(0,0,0,0)in firefox/chrome, for instance, both being accurate ways of specifying transparent).
有研究表明，css('background')将始终产生一个空字符串，或者undefined，根据浏览器。css('background-color')将正确返回手头元素的颜色；但每个浏览器的值也不同，因此测试起来很麻烦（例如，transparent在 IE 中，rgba(0,0,0,0)在 firefox/chrome 中，两者都是指定透明的准确方法）。
jQuery.fn.getBg = function() {
return $(this).parents().filter(function() {
// only checking for IE and Firefox/Chrome. add values as cross-browser compatibility is required
var color = $(this).css('background-color');
return color != 'transparent' && color != 'rgba(0, 0, 0, 0)';
}).eq(0).css('background-color');
};
回答by Rabbott
I believe the correct way to do this is to check the .length property.
我相信正确的方法是检查 .length 属性。
In your case you'd want to loop through all of your elements and check for the first one that meets
在您的情况下，您希望遍历所有元素并检查第一个满足的元素
.css('background').length != 0
回答by Pointy
$('selector').parents().filter(function() { return !!$(this).css('background'); });
回答by hurikhan77
I'd try something like this:
我会尝试这样的事情：
var background = 0;
$('element').parents().each(function() {
if (!background && ((e = $(this).css('background')).length > 0)) background = e;
});
Not sure if this exact if-clause works, but the each() should do the trick. The first match will fill the background variable and ignore the rest of the parents while traversing up in the chain.
不确定这个确切的 if 子句是否有效，但 each() 应该可以解决问题。第一个匹配项将填充背景变量并在链中向上遍历时忽略其余的父项。
Edit:Amended to resolve css('background')correctly which may emit an empty string. Additionally, each()does not pass the element, but index and element, thus make use of thisinstead and discard all parameters.
编辑：修正以css('background')正确解析可能会发出空字符串。此外，each()不传递元素，而是传递索引和元素，从而使用this替代并丢弃所有参数。
回答by Trevor Nestman
Retrieve element background color or gradient
检索元素背景颜色或渐变
I came across this as I was trying to apply a background to elements that didn't have one (background gradient or color) already.
我在尝试将背景应用到还没有背景（背景渐变或颜色）的元素时遇到了这个问题。
This function returns the value of the background gradient or background color if it has one and returns false if it doesn't:
此函数返回背景渐变或背景颜色的值（如果有），如果没有，则返回 false：
jQuery.fn.getBg = function() {
var color = $(this).css('background-color');
var image = $(this).css('background-image');
if (color != 'transparent' && color != 'rgba(0, 0, 0, 0)') {
return color;
}
if (image != 'none') {
return image;
}
return false;
};
Now if you simply want to test if an element has a background, you can do this using the above function:
现在如果你只是想测试一个元素是否有背景，你可以使用上面的函数来做到这一点：
var curBack = $(this).getBg();
if (curBack) { /* Element has a background */ }
else { /* Element doesn't have a background */ }
Hopefully this is somewhat resourceful for someone working with gradients.
希望这对于使用渐变的人来说有点足智多谋。
回答by SDReyes
You could do something like:
你可以这样做：
$('#test').parents().has(css('background')).filter(':first');
Hope it helps : )
希望能帮助到你 ： ）
