मैं jQuery में एकाधिक कक्षाओं के साथ एक तत्व का चयन कैसे कर सकता हूं?




jquery-selectors (7)

आप filter() फ़ंक्शन का उपयोग करके ऐसा कर सकते हैं:

$(".a").filter(".b")

मैं उन सभी तत्वों का चयन करना चाहता हूं जिनमें दो वर्ग a और b

<element class="a b">

तो, केवल उन तत्वों जिनमें दोनों वर्ग हैं।

जब मैं $(".a, .b") करता हूं तो यह मुझे संघ देता है, लेकिन मुझे चौराहे चाहिए।


आपके पास जो समस्या है, वह यह है कि आप Group Selector का उपयोग कर रहे हैं, जबकि आपको एक Multiples selector का उपयोग करना चाहिए! अधिक विशिष्ट होने के लिए, आप $('.a.b') $('.a, .b') का उपयोग कर रहे हैं जबकि आपको $('.a.b') का उपयोग करना चाहिए।

अधिक जानकारी के लिए, यहां चयनकर्ताओं को गठबंधन करने के विभिन्न तरीकों का अवलोकन देखें!

समूह चयनकर्ता: ","

सभी <h1> तत्वों और सभी <p> तत्वों और सभी <a> तत्वों का चयन करें:

$('h1, p, a')

गुणक चयनकर्ता: "" (कोई चरित्र नहीं)

कक्षा code और red साथ सभी <input> type text तत्वों का चयन करें:

$('input[type="text"].code.red')

Descendant चयनकर्ता: "" (अंतरिक्ष)

<p> तत्वों के अंदर <i> तत्वों का चयन करें:

$('p i')

बाल चयनकर्ता: ">"

सभी <ul> तत्वों का चयन करें जो <li> तत्व के तत्काल बच्चे हैं:

$('li > ul')

निकट भाई चयनकर्ता: "+"

<h2> तत्वों के तुरंत बाद रखे गए सभी <a> तत्वों का चयन करें:

$('h2 + a')

सामान्य भाई चयनकर्ता: "~"

सभी <span> तत्वों का चयन करें जो <div> तत्वों के भाई बहन हैं:

$('div ~ span')

तत्व के साथ बस एक और मामला का जिक्र करें:

जैसे <div id="title1" class="ABC">

बस टाइप करें: $("div#title1.ABC")


बेहतर प्रदर्शन के लिए आप उपयोग कर सकते हैं

$('div.a.b')

यह आपके पृष्ठ पर मौजूद सभी HTML तत्वों के माध्यम से कदम उठाने के बजाय केवल div तत्वों के माध्यम से दिखाई देगा।


यदि आप एक छेड़छाड़ चाहते हैं, तो बस चयनकर्ताओं को बीच में रिक्त स्थान के बिना लिखें।

$('.a.b')

तो ऐसे तत्व के लिए जिसमें कक्षा b और c साथ आईडी है, तो आप लिखेंगे:

$('#a.b.c')

वेनिला जावास्क्रिप्ट समाधान: -

document.querySelectorAll('.a.b')


$('.a .b , .a .c').css('border', '2px solid yellow');
//selects b and c
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="a">a
  <div class="b">b</div>
  <div class="c">c</div>
  <div class="d">d</div>
</div>







jquery-selectors