我需要检查元素是否具有已定义的css属性,但是使用jQuery.css()函数时遇到了一些麻烦。
我要寻找的属性是宽度。
如果元素没有定义的宽度,请尝试以下操作:
if(base.$element.css('width') !== 'undefined')
我得到了浏览器的计算宽度。
这是我抛出的一个非常简单(可能需要改进)的插件,它将为您提供内联样式属性的值(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));
您可以这样称呼它:
//Returns value of "width" property or `undefined`
var width = $("#someElem").inlineStyle("width");
这是一个有效的例子。
请注意,它只会返回匹配集中第一个元素的值。
由于undefined
在找不到该样式属性时会返回它,因此可以在如下情况下使用它:
if (base.$element.inlineStyle("width")) {
// It has a `width` property!
}
更新资料
这是一个短得多的版本。我意识到,它prop("style")
返回一个对象,而不是字符串,并且该对象的属性与可用的样式属性相对应。因此,您可以执行以下操作:
(function ($) {
$.fn.inlineStyle = function (prop) {
return this.prop("style")[$.camelCase(prop)];
};
}(jQuery));
您可能想$.camelCase
用自定义的驼峰函数来代替对的使用,因为jQuery似乎是未公开的,可能不太适合使用。我只是在这里用它,因为它更短。
这是一个可行的例子。请注意,在这种情况下,如果在元素上找不到样式,则返回值将为空字符串。该结果仍为false
,因此上述if
声明仍然有效。
为什么不只是:
var $el = $('element[style*="width"]');
然后您可以使用以下命令进行测试:
if ( $el.length ) {
//...
}
检查“宽度”,例如:
if ($(element).prop("style")["width"] !== '')
{...}
使用.attr
检查style
属性。
if(base.$element.attr('style').length > 0) {
//...
}
如果你在乎宽度,那么
if(base.$element.attr('style').indexOf('width') !== -1) {
//...
}
马修,您可以检查样式属性是否未定义
var attr = $(this).attr('style');
if (typeof attr !== 'undefined' ) {
}
本文地址:http://jquery.askforanswer.com/jqueryjianchayuansushifoujuyouneiliandingyidetedingyangshishuxing.html
文章标签:css , inline-styles , jquery
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!
文章标签:css , inline-styles , jquery
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!
评论已关闭!