jQuery检查元素是否具有内联定义的特定样式属性

2020/12/31 22:22 · jquery ·  · 0评论

我需要检查元素是否具有已定义的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
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!