यहाँ एक नमूना HTML कोड है:
<div class="container">
<div class="zone">
<img class="thumb" alt="GG">
</div>
<div class="zone">
<span> </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;
}
चीयर्स, सिंह!