jQuery का निर्धारण अगर एक मिलान वर्ग एक दिया गया आईडी है


95

JQuery के निम्नलिखित कथन के बराबर आईडी क्या है?

$('#mydiv').hasClass('foo')

तो आप एक कक्षा का नाम दे सकते हैं और जांच सकते हैं कि इसमें एक आपूर्ति की गई आईडी है।

कुछ इस तरह:

$('.mydiv').hasId('foo')

मैं एक निश्चित div के लिए एक शैली लागू करना चाहता हूं। उदाहरण के लिए लोड समय पर सभी को फू की एक कक्षा के साथ दिखाया जाएगा, लेकिन मैं कक्षा के एक उदाहरण को बंद करना चाह सकता हूं जिसमें बार की एक आईडी है।
निकोलस मरे

1
तब आप बस करेंगे कि $('#bar.foo').toggle();आपके पास केवल एक आईडी होगी क्योंकि वे दस्तावेज के लिए अद्वितीय होने के लिए आवश्यक हैं। यदि आप केवल उस आईडी को टॉगल करने के लिए चींटी करते हैं यदि वह वर्ग की है, fooतो बस कक्षा को आईडी चयनकर्ता में जोड़ें। यदि चयनकर्ता एक खाली सेट पाता है तो कुछ भी नहीं होगा, यदि यह परिणामों के साथ एक सेट पाता है (जिसमें से केवल एक ही होगा) तो यह तत्व को टॉगल करेगा। मुझे लगता है कि आप इसे उखाड़ फेंक रहे हैं।
16

3
सिर्फ यह कहने के लिए कि यह लोगों को निराश कर रहा है "आप कभी ऐसा क्यों करना चाहेंगे?" जब मैं अभी यह करने की कोशिश कर रहा हूं। HasClass के साथ समस्या यह है कि यदि कोई भी तत्व जो चयनकर्ता से मेल खाता है, तो दिया गया वर्ग सही है। इसलिए जहां मेरे पास कक्षा "केक" के साथ कई पी हैं और प्रत्येक के लिए अतिरिक्त कक्षा के नाम ("एक", "दो" आदि) मुझे समस्या हो रही है। मैं p.cake के सामान्य सेट का चयन करना चाहता हूं और फिर एक सशर्त है (यदि वर्ग = "एक" - $ var = 23 - आदि)। मुद्दा यह है कि मैं अतिरिक्त वर्ग नाम के आधार पर एक अलग $ var पास करने की कोशिश कर रहा हूं। मैं कोशिश कर रहा हूँ कि मैं पूरे बिट o
स्टेला

जवाबों:


171

आप कई चयनकर्ताओं को मिलाकर उस तर्क को चयनकर्ता में सेंध लगा सकते हैं । उदाहरण के लिए, हम दिए गए आईडी के साथ सभी तत्वों को लक्षित कर सकते हैं, जिसमें एक विशेष वर्ग भी है:

$("#foo.bar"); // Matches <div id="foo" class="bar">

यह सीएसएस में आपके द्वारा लिखे गए कुछ के समान दिखना चाहिए। ध्यान दें कि यह सभी #fooतत्वों पर लागू नहीं होगा (हालांकि केवल एक ही होना चाहिए), और यह सभी .barतत्वों पर लागू नहीं होगा (हालांकि कई हो सकते हैं)। यह केवल उन तत्वों को संदर्भित करेगा जो दोनों विशेषताओं पर योग्य हैं।

jQuery में एक शानदार .isतरीका भी है जो आपके निर्धारण को निर्धारित करता है कि किसी तत्व में कुछ गुण हैं या नहीं। आप एक स्ट्रिंग चयनकर्ता, एक HTML तत्व, या एक अन्य jQuery वस्तु के खिलाफ एक jQuery संग्रह का परीक्षण कर सकते हैं। इस मामले में, हम इसे एक स्ट्रिंग चयनकर्ता के खिलाफ जाँचेंगे:

$(".bar:first").is("#foo"); // TRUE if first '.bar' in document is also '#foo'

32
के लिए +1 is().hasId()सिर्फ एक चयनकर्ता होना चाहिए क्योंकि यह .hasClass()वास्तव में एक स्पष्ट साथी की तरह लगता है ...
मैट फ्लेचर

43

मैं शायद इसका उपयोग करूंगा $('.mydiv').is('#foo');कि अगर आप ईद जानते हैं तो आप इसे पहली बार चयनकर्ता पर क्यों लागू करेंगे?


17
हो सकता है कि कोड एक कॉलबैक फ़ंक्शन में जा रहा हो जिसे एक निश्चित मामले को अलग तरीके से संभालने की आवश्यकता होती है। इसलिए, फ़ंक्शन को अज्ञात विशेषताओं के साथ स्वचालित रूप से एक jQuery ऑब्जेक्ट पास किया जाता है। इस मामले में, $ ('आपका जवाब')। ('सहायक') है;
पीटर जी

1
मैं किसी भी कारण से सोच सकता हूं। क्या होगा यदि आप एक मोबाइल विशिष्ट सेटिंग लागू करना चाहते हैं, जैसे कि अगर किसी तत्व का आईडी = "मोबाइल" है। क्यों महत्वपूर्ण नहीं है।
१४:

खैर केवल 1 तत्व को कभी भी दिया idजाना चाहिए अन्यथा यह कुछ अन्य विशेषता होना चाहिए ... मुझे लगता है कि यदि पृष्ठ या क्लाइंट / उपयोगकर्ता-एजेंट के आधार पर प्रश्न में तत्व का संरचनात्मक स्थान ठीक है, लेकिन इसके अलावा अन्य ।। ।
prodigitalson

19

अद्यतन: खेद गलत समझा सवाल, हटा दिया .has()जवाब।

दूसरा वैकल्पिक तरीका है, .hasId()प्लगइन बनाएं

// the plugin
$.fn.hasId = function(id) {
  return this.attr('id') == id;
};

// select first class
$('.mydiv').hasId('foo') ?
  console.log('yes') : console.log('no');

// select second class
// $('.mydiv').eq(1).hasId('foo')
// or
$('.mydiv:eq(1)').hasId('foo') ?
  console.log('yes') : console.log('no');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="mydiv" id="foo"></div>
<div class="mydiv"></div>


5
क्षमा करें, लेकिन मुझे लगता है कि आपने इस प्रश्न का गलत अर्थ निकाला है: () API ने यह रिपोर्ट की है: उन मिलान वाले तत्वों के सेट को कम करें जिनके पास एक वंश है जो चयनकर्ता या DOM तत्व से मेल खाता है। ओपी पूछ रहा है कि कैसे परीक्षण करें कि कक्षा 'myDiv' वाले तत्व में भी Id foo है, जबकि है () 'myDiv' के वंशजों के लिए Id 'foo' होगा।
झुकाव

7

मान लें कि आप कुछ DOM ऑब्जेक्ट्स के माध्यम से पुनरावृत्ति कर रहे हैं और आप एक निश्चित ID के साथ एक तत्व को ढूंढते और पकड़ना चाहते हैं

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
</div>

आप या तो खोजने के लिए कुछ लिख सकते हैं

$('#myDiv').find('#bar')

ध्यान दें कि यदि आप एक वर्ग चयनकर्ता का उपयोग कर रहे थे, तो खोज विधि सभी मिलान तत्वों को वापस कर देगी।

या आप एक पुनरावृत्त फ़ंक्शन लिख सकते हैं जो अधिक उन्नत कार्य करेगा

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
    <div id="fo1"><div>
    <div id="bar1"><div>
    <div id="fo2"><div>
    <div id="bar2"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).attr('id') == 'bar1')
       //do something with bar1
});

वर्ग चयनकर्ता के लिए समान कोड को आसानी से संशोधित किया जा सकता है।

<div id="myDiv">
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).hasClass('bar'))
       //do something with bar
});

मुझे खुशी है कि आपने अपनी समस्या को इंडेक्स () के साथ हल किया है, जो कभी भी आपके लिए काम करती है। मुझे उम्मीद है कि यह उसी समस्या के साथ दूसरों की मदद करेगा। चियर्स :)


4
$('#' + theMysteryId + '.someClass').each(function() { /* do stuff */ });

प्रत्येक अनावश्यक है क्योंकि वहाँ एक से अधिक कभी नहीं होगा #theMysteryId
16

2
वैसे यह आपको एक चर को निर्दिष्ट करने की परेशानी से बचाता है, यह देखने के लिए जाँचता है कि लंबाई गैर-रिक्त है, और फिर कोड के साथ आगे बढ़ रहा है। यदि चयनकर्ता कुछ भी नहीं जोड़ता है तो jQuery सिर्फ "प्रत्येक" फ़ंक्शन को कॉल नहीं करेगा, इसलिए यह अच्छा और साफ है। अब अगर आप सभी कुछ jQuery एपीआई कॉल करना चाहते हैं, तो सुनिश्चित करें।
नुकीले

4

केवल यह कहने के लिए कि मैंने अंततः सूचकांक () का उपयोग करके इसे हल किया है।

कुछ और काम नहीं कर रहा था।

तो सिबलिंग तत्वों के लिए यह एक अच्छा काम है यदि आप पहली बार एक सामान्य वर्ग द्वारा चयन कर रहे हैं और फिर किसी विशिष्ट के लिए कुछ अलग करना चाहते हैं।

EDIT: उन लोगों के लिए जो (मेरी तरह) इंडेक्स () नहीं जानते, प्रत्येक तत्व के लिए एक इंडेक्स वैल्यू देता है, जो चयनकर्ता से मेल खाता है, 0 से गिना जाता है, जो कि DOM में उनके आदेश पर निर्भर करता है। जब तक आप जानते हैं कि वर्ग = "फू" के साथ कितने तत्व हैं, आपको आईडी की आवश्यकता नहीं है।

जाहिर है कि यह हमेशा मदद नहीं करेगा, लेकिन कोई इसे उपयोगी पा सकता है।



1

आप यह भी जांच सकते हैं कि क्या ऐसा करने से आईडी तत्व का उपयोग किया जाता है:

if(typeof $(.div).attr('id') == undefined){
   //element has no id
} else {
   //element has id selector
}

मैं वैश्विक डेटाटेबल्स और विशिष्ट ऑर्डर किए गए डेटाटेबल्स के लिए इस पद्धति का उपयोग करता हूं


अपरिभाषित इतने 'अपरिभाषित' की तरह काम करने के लिए उद्धरण में होना चाहिए
लियो
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.