क्या यह जांचना संभव है कि किसी तत्व का सीएसएस display == blockया noneजावास्क्रिप्ट का उपयोग कर रहा है या नहीं ?
जवाबों:
जैसा कि sdleihssirhc नीचे कहता है, अगर तत्व displayविरासत में मिला है या सीएसएस नियम द्वारा निर्दिष्ट किया जा रहा है, तो आपको इसकी गणना शैली प्राप्त करने की आवश्यकता होगी :
return window.getComputedStyle(element, null).display;
तत्वों की एक styleसंपत्ति होती है जो आपको बताएगी कि आप क्या चाहते हैं, अगर शैली को इनलाइन या जावास्क्रिप्ट के साथ घोषित किया गया था:
console.log(document.getElementById('someIDThatExists').style.display);
आपको एक स्ट्रिंग मान देगा।
currentStyle? इसके बारे में कभी नहीं सुना, यह भी जाँच की document.body.currentStyleऔर कुछ भी नहीं मिला (आश्चर्य नहीं)
यदि शैली को इनलाइन या जावास्क्रिप्ट के साथ घोषित किया गया था, तो आप styleऑब्जेक्ट पर प्राप्त कर सकते हैं :
return element.style.display === 'block';
अन्यथा, आपको गणना की गई शैली प्राप्त करनी होगी, और ब्राउज़र असंगतताएं भी होंगी। IE एक साधारण currentStyleवस्तु का उपयोग करता है , लेकिन बाकी सभी एक विधि का उपयोग करते हैं:
return element.currentStyle ? element.currentStyle.display :
getComputedStyle(element, null).display;
nullFirefox संस्करण 3 और नीचे में आवश्यक था।
===और !==ऑपरेटरों " नामक अनुभाग में क्यों ।
===बजाय उपयोग करने में कोई समस्या नहीं है ==, लेकिन समान रूप से इसका कोई फायदा भी नहीं है। दोनों ऑपरेंड को स्ट्रिंग्स होने की गारंटी है, इसलिए दोनों ऑपरेटर्स बिल्कुल एक जैसा कदम उठाते हैं।
JQuery के लिए, आप इस तरह का मतलब है?
$('#object').css('display');
आप इसे इस तरह से देख सकते हैं:
if($('#object').css('display') === 'block')
{
//do something
}
else
{
//something else
}
यह उत्तर वैसा नहीं है जैसा आप चाहते हैं, लेकिन यह कुछ मामलों में उपयोगी हो सकता है। यदि आपको पता है कि प्रदर्शित होने पर तत्व के कुछ आयाम हैं, तो आप इसका उपयोग भी कर सकते हैं:
var hasDisplayNone = (element.offsetHeight === 0 && element.offsetWidth === 0);
संपादित करें: यह सीएसएस displayसंपत्ति की प्रत्यक्ष जांच से बेहतर क्यों हो सकता है ? क्योंकि आपको सभी मूल तत्वों की जांच करने की आवश्यकता नहीं है। यदि कुछ मूल तत्व हैं display: none, तो उसके बच्चे भी छिपे हुए हैं, लेकिन फिर भी है element.style.display !== 'none'।
यह जानने के लिए कि क्या यह सादे जावास्क्रिप्ट के साथ दिखाई दे रहा है, यह देखें कि क्या प्रदर्शन संपत्ति 'कोई नहीं' है ('ब्लॉक' के लिए जांच न करें, यह रिक्त या 'इनलाइन' भी हो सकती है और फिर भी दिखाई दे सकती है):
var isVisible = (elt.style.display != "none");
यदि आप jQuery का उपयोग कर रहे हैं, तो आप इसके बजाय इसका उपयोग कर सकते हैं:
var isVisible = $elt.is(":visible");
शुद्ध जावास्क्रिप्ट के साथ आप style.displayसंपत्ति की जांच कर सकते हैं। JQuery के साथ आप उपयोग कर सकते हैं$('#id').css('display')
आप इसे jQuery के उदाहरण के साथ देख सकते हैं:
$("#elementID").css('display');
यह इस तत्व की प्रदर्शन संपत्ति के बारे में जानकारी के साथ स्ट्रिंग लौटेगा।