jQuery जांचें कि तत्व में एक विशिष्ट शैली संपत्ति परिभाषित इनलाइन

Question

मुझे यह जांचने की आवश्यकता है कि किसी तत्व के पास परिभाषित सीएसएस गुण है, लेकिन मुझे jQuery.css() फ़ंक्शन का उपयोग करके कुछ परेशानी हो रही है।

मैं जिस संपत्ति की तलाश कर रहा हूं वह चौड़ाई है।

तत्व एक परिभाषित चौड़ाई नहीं है, तो और मैं यह कोशिश:

if(base.$element.css('width') !== 'undefined') 

मैं ब्राउज़र की गणना चौड़ाई मिलता है।

Answer 1

यहाँ एक बहुत ही सरल (शायद सुधार की बहुत जरूरत होती) आप एक इनलाइन शैली का मूल्य मिल जाएगा मैं एक साथ फेंक दिया गया है प्लगइन है संपत्ति (और 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"); 

यहां एक working example है।

ध्यान दें कि यह केवल मिलान किए गए सेट में पहले तत्व के लिए मान वापस करेगा।

चूंकि यह रिटर्न 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)); 

आप jQuery एक undocumented प्रतीत होता है और शायद पर भरोसा करने के लिए अच्छा नहीं है के बाद से, एक कस्टम CamelCase समारोह के साथ $.camelCase के उपयोग को बदलने के लिए कर सकते हैं। मैंने इसे यहां छोटा इस्तेमाल किया क्योंकि यह छोटा है।

यहां एक working example है। ध्यान दें कि इस मामले में, यदि स्टाइल तत्व तत्व पर नहीं मिला तो वापसी मान खाली स्ट्रिंग होगी। यह अभी भी false का मूल्यांकन करेगा, इसलिए ऊपर if कथन अभी भी काम करना चाहिए।

Answer 2

style विशेषता देखने के लिए .attr का उपयोग करें।

if(base.$element.attr('style').length > 0) { 
    //... 
} 

आप चौड़ाई के बारे में परवाह है, तो

if(base.$element.attr('style').indexOf('width') !== -1) { 
    //... 
} 

Answer 3

मैथ्यू आप देख सकते हैं कि शैली विशेषता अपरिभाषित है या नहीं

var attr = $(this).attr('style'); 
    if (typeof attr !== 'undefined') { 
    } 

Answer 4

क्यों नहीं बस:

var $el = $('element[style*="width"]'); 

और फिर उसे अपने साथ परीक्षण कर सकते हैं:

if ($el.length) { 
    //... 
} 

Answer 5

के लिए जांच की जा रही उदाहरण के लिए "चौड़ाई":

if ($(element).prop("style")["width"] !== '') 
{...}