jQuery 检查元素是否具有内联定义的特定样式属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11306736/
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 a specific style property defined inline
提问by Matthew Grima
I need to check whether an element has a defined css property given to it, but I'm having some trouble using the jQuery.css() function.
我需要检查一个元素是否具有已定义的 css 属性，但是我在使用 jQuery.css() 函数时遇到了一些问题。
The property I'm looking for is width.
我正在寻找的属性是宽度。
If the element does not have a defined width and I try this:
如果元素没有定义的宽度，我试试这个：
if(base.$element.css('width') !== 'undefined')
I get the browser's computed width.
我得到浏览器的计算宽度。
回答by James Allardice
Here's a very simple (probably in much need of improvement) plugin I've thrown together that will get you the value of an inline style property (and return undefinedif that property is not found):
这是一个非常简单（可能需要改进）的插件，我将它放在一起，它可以为您提供内联样式属性的值（undefined如果找不到该属性，则返回）：
?(function ($) {
$.fn.inlineStyle = function (prop) {
var styles = this.attr("style"),
value;
styles && styles.split(";").forEach(function (e) {
var style = e.split(":");
if ($.trim(style[0]) === prop) {
value = style[1];
}
});
return value;
};
}(jQuery));
You can call it like this:
你可以这样称呼它：
//Returns value of "width" property or `undefined`
var width = $("#someElem").inlineStyle("width");
Here's a working example.
这是一个工作示例。
Note that it will only return the value for the first elementin the matched set.
请注意，它只会返回匹配集中第一个元素的值。
Since it returns undefinedwhen that style property is not found, you can use it in your situation like this:
由于它undefined在找不到该样式属性时返回，因此您可以在您的情况下使用它，如下所示：
if (base.$element.inlineStyle("width")) {
// It has a `width` property!
}
Update
更新
Here's a much, much shorter version. I realised that prop("style")returns an object, not a string, and the properties of that object correspond to the available style properties. So you can just do this:
这是一个非常短的版本。我意识到它prop("style")返回一个对象，而不是一个字符串，并且该对象的属性对应于可用的样式属性。所以你可以这样做：
(function ($) {
$.fn.inlineStyle = function (prop) {
return this.prop("style")[$.camelCase(prop)];
};
}(jQuery));
You may want to replace the use of $.camelCasewith a custom camelcase function, since the jQuery one appears to be undocumented and is probably not good to rely upon. I just used it here as it's shorter.
您可能想$.camelCase用自定义的驼峰函数替换使用，因为 jQuery 函数似乎没有文档记录并且可能不太好依赖。我只是在这里使用它，因为它更短。
Here's a working exampleof that one. Note that in this case, the return value will be the empty string if the style was not found on the element. That will still evaluate to false, so the above ifstatement should still work.
这是一个工作示例。请注意，在这种情况下，如果在元素上找不到样式，则返回值将是空字符串。那仍然会评估为false，所以上面的if语句应该仍然有效。
回答by Alain Jacomet Forte
Why not just:
为什么不只是：
var $el = $('element[style*="width"]');
And then you can test it with:
然后你可以测试它：
if ( $el.length ) {
//...
}
回答by Angelo
Checking for "width" for example:
例如检查“宽度”：
if ($(element).prop("style")["width"] !== '')
{...}
回答by xdazz
Use .attrto check the styleattribute.
使用.attr检查style属性。
if(base.$element.attr('style').length > 0) {
//...
}
If you care about the width, then
如果你关心宽度，那么
if(base.$element.attr('style').indexOf('width') !== -1) {
//...
}
回答by Ramesh R C
Matthew you can check if style attribute is undefined or not
马修你可以检查样式属性是否未定义
var attr = $(this).attr('style');
if (typeof attr !== 'undefined' ) {
}
