/ / कैसे तत्वों को खोजने के लिए जब बाल तत्व मौजूद है या नहीं JQuery चयनकर्ता के साथ? - jquery, सीएसएस, चयनकर्ता

कैसे तत्वों को खोजने के लिए जब बच्चे तत्व मौजूद है या नहीं JQuery चयनकर्ता के साथ?-jquery, सीएसएस, चयनकर्ता

यहाँ एक नमूना HTML कोड है:

<div class="container">
<div class="zone">
<img class="thumb" alt="GG">
</div>
<div class="zone">
<span>&nbsp;</span>
</div>
<div class="zone">
<img class="thumb" alt="HH">
</div>
</div>

मैं सभी का मिलान करना चाहता हूं div उसके साथ zone कक्षा जो है img साथ में alt=GG याँ नहीं img बिल्कुल भी।

निम्नलिखित कोड काम नहीं करता है:

$("div.zone img[alt="GG"], :not(div.zone:has(img))")

उत्तर:

उत्तर № 1 के लिए -1

इसे इस्तेमाल करे। यह कार्यों की पुष्टि करता है, वांछित क्षेत्र को लाल रंग में बांधा गया है। (संपादित: धन्यवाद PSL)

$(document).ready(function(){
$("div.zone:has(img[alt="GG"]),div.zone:not(:has(img))").css("border","1px solid red");
});

जवाब के लिए 3 № 2

आप इसे आजमा सकते हैं:

var $specialDivs= $("div.zone:has("img[alt="GG"]"), div.zone:not(:has(img))");
^    ^                          ^        ^
|    |                          |        |
div.zone has image with alt      div.zone not having any image

बेला

आपके चयनकर्ता के साथ समस्या यह है कि "div.zone img[alt="GG"] div और छवि के बीच का स्थान div.zone की खोज करेगा, जिनके बच्चों की छवि पूरी विशेषता के साथ है। जबकि छवि प्रत्यक्ष वंशज है div.zone, इसलिए आपके चयनकर्ता को आपको कुछ भी नहीं मिलेगा।


जवाब के लिए 0 № 3

आप इसका उपयोग कर सकते हैं filter तरीका

$("div.zone").filter(function() {
return !$(this).find("img").length || $(this).find("img[alt="GG"]").length
});

पहेली की जांच करें


जवाब के लिए 0 № 4

आपको ऐसा करने के लिए Jquery की आवश्यकता नहीं है। बस CSS चयनकर्ताओं के साथ आप इसे कर सकते हैं: डेमो

यहाँ CSS चयनकर्ता है:

.container > div.zone img,
.container > div.zone img[alt="GG"] {
background: red;
}

चीयर्स, सिंह!