jQuery: जांचें कि क्या div कुछ खास वर्ग के नाम के साथ मौजूद है

Question

JQuery का उपयोग करके मैं प्रोग्रामेटिक रूप से divइस तरह का एक गुच्छा तैयार कर रहा हूं :

<div class="mydivclass" id="myid1">Some Text1</div>
<div class="mydivclass" id="myid2">Some Text2</div>

कहीं और मेरे कोड में मुझे पता लगाने की आवश्यकता है कि क्या ये डीआईवी मौजूद हैं। Divs के लिए क्लास का नाम समान है लेकिन प्रत्येक div के लिए आईडी बदल जाती है। किसी भी विचार कैसे उन्हें jQuery का उपयोग कर पता लगाने के लिए?

Answer 1

आप इसे JQuery से लौटाए गए पहले ऑब्जेक्ट की जाँच करके इसे सरल बना सकते हैं:

if ($(".mydivclass")[0]){
    // Do something if class exists
} else {
    // Do something if class does not exist
}

इस मामले में यदि पहले ( [0]) सूचकांक में एक सत्य मान है , तो मान लीजिए कि वर्ग मौजूद है।

संपादित करें 04/10/2013: मैंने यहां एक jsperf टेस्ट केस बनाया है ।

Comments

अच्छी बात है, या तो यह एक संपत्ति खोज है। मुझे चार पात्रों की परवाह नहीं है, लेकिन यह संदर्भ के आधार पर स्पष्ट हो सकता है ...

— टीजे क्राउडर

मैंने इस समाधान का उपयोग करते हुए समाप्त कर दिया है, हालांकि अन्य समाधान भी हैं जो काम करते हैं। त्वरित उत्तर के लिए धन्यवाद।

— अवतार

दिलचस्प है, आप सोच सकते हैं कि :firstप्रदर्शन को फेंकने से प्रदर्शन में मदद मिलेगी (पता नहीं कि प्रदर्शन @itgorilla के लिए एक महत्वपूर्ण मानदंड है), लेकिन क्या यह ब्राउज़र द्वारा बेतहाशा भिन्न होता है, संभवत: क्योंकि यह देशी सुविधाओं को बदलता है jQuery का उपयोग कर सकते हैं चयन। यहाँ एक परीक्षण मामला है जहाँ div मौजूद है , और यहाँ एक है जहाँ यह मौजूद नहीं है ।

— टीजे क्राउडर

और अगर मैं एक कोड को निष्पादित नहीं करना चाहता था यदि कोई वर्ग मौजूद नहीं है?

— थॉमस सेबेस्टियन

@ThomasSebastian प्रयास करेंif (!$(".mydivclass")[0]){ /* do stuff */ }

— Shaz

Answer 2

आप उपयोग कर सकते हैं size(), लेकिन jQuery आपको किसी अन्य फ़ंक्शन कॉल के ओवरहेड से बचने के लिए लंबाई का उपयोग करने की सलाह देता है:

$('div.mydivclass').length

इसलिए:

// since length is zero, it evaluates to false
if ($('div.mydivclass').length) {

http://api.jquery.com/size/

http://api.jquery.com/length/

अपडेट करें

चयनित उत्तर एक पूर्ण परीक्षण का उपयोग करता है, लेकिन यह थोड़ा त्रुटिपूर्ण है क्योंकि यह तत्व चयन के भाग के रूप में भी शामिल है, जो कि यहां परीक्षण नहीं किया गया है। यहाँ एक अद्यतन परीक्षण है:

http://jsperf.com/check-if-div-exists/3

परीक्षण का मेरा पहला भाग दिखाता है कि संपत्ति पुनर्प्राप्ति सूचकांक पुनर्प्राप्ति की तुलना में तेज़ है, हालांकि IMO यह बहुत ही नगण्य है। मैं अभी भी लंबाई का उपयोग करना पसंद करता हूं क्योंकि यह अधिक स्पष्ट स्थिति के बजाय कोड के इरादे के रूप में अधिक समझ में आता है।

Comments

Jsperf.com पर आपके द्वारा टूल को दिए गए लिंक के अनुसार, .lengthवर्तमान में सर्वश्रेष्ठ औसत प्रदर्शन प्रदान करता है।

— gmeben

एक चेक के लिए सबसे छोटे प्रदर्शन प्रभाव के साथ मेरी जरूरतों को पूरा करता है।

— डेविड ओ'रगन

Answer 3

बिना jQuery के:

देशी जावास्क्रिप्ट हमेशा तेज होने वाला है। इस मामले में: (उदाहरण)

if (document.querySelector('.mydivclass') !== null) {
    // .. it exists
}

---

यदि आप यह देखना चाहते हैं कि क्या किसी मूल तत्व में विशिष्ट वर्ग के साथ कोई अन्य तत्व है, तो आप निम्न में से किसी एक का उपयोग कर सकते हैं। (उदाहरण)

var parent = document.querySelector('.parent');

if (parent.querySelector('.child') !== null) {
    // .. it exists as a child
}

वैकल्पिक रूप से, आप .contains()मूल तत्व पर विधि का उपयोग कर सकते हैं । (उदाहरण)

var parent = document.querySelector('.parent'),
    child = document.querySelector('.child');

if (parent.contains(child)) {
    // .. it exists as a child
}

---

..और अंत में, यदि आप यह देखना चाहते हैं कि क्या दिए गए तत्व में एक निश्चित वर्ग है, तो उपयोग करें:

if (el.classList.contains(className)) {
    // .. el contains the class
}

Answer 4

$('div').hasClass('mydivclass')// Returns true if the class exist.

Comments

सच है कि यह एक विकल्प है, लेकिन एक महंगा है। पहले के उत्तर ( कुछ ब्राउज़रों पर स्पष्ट रूप से धीमा) में उपयोग किए जाने वाले दृष्टिकोण की तुलना में धीमा होगा , और साथ ही बहुत बड़ा मेमोरी प्रभाव होगा (jQuery के पृष्ठ पर सभीdiv तत्वों की एक सरणी का निर्माण करना है , फिर वापस जाएं और उनके माध्यम से यह देखने के लिए कि क्या उनके पास वह वर्ग है, सभी अंत में सरणी को फेंक देते हैं)।

— टीजे क्राउडर

@tj hasClass33% तेज है तो अन्य चयनकर्ता यहां पर हैं। चेक jsperf.com/hasclass00

— हुसैन

@ हुसैन: केवल एक पूरी तरह से अवास्तविक परीक्षण के मामले (दो divतत्वों) के साथ जो कि मैंने जिस मुद्दे को हाइलाइट किया है, उसे चरणबद्ध करता है (सरणी का निर्माण)। इसे divs के एक समूह के साथ आज़माएँ: jsperf.com/hasclass00/2 यह क्रोम की मेरी कॉपी पर 63% धीमा है, फ़ायरफ़ॉक्स की मेरी कॉपी पर 43% धीमा, 98% (!) ओपेरा पर धीमा। लेकिन इसके अलावा, यह समझ में आता है कि डिवोर्स की एक सूची बनाने के लिए यह धीमा है और फिर इसे खोजकर्ता को चयनकर्ता इंजन को इसकी ज़रूरत की सभी जानकारी देने के बजाय।

— टीजे क्राउडर

@ हुसैन: ध्यान दें कि मैंने आपके दावों को बहुत ही संतुलित रूप से प्रस्तुत किया है, और संतुलित जवाबी साक्ष्य प्रस्तुत किए हैं। मुझे खेद है कि अगर मैंने एक तंत्रिका को छुआ, तो ऐसा लगता है कि पिछली बार भी हुआ था। बस आराम करो, यह एक व्यक्तिगत मामला नहीं है, यह एक तकनीकी चर्चा है। एक मोटी त्वचा और एक खुले दिमाग StackOverflow पर उपयोगी होते हैं।

— टीजे क्राउडर

@ हुसैन: एचटीएमएल 5 सीएसएस चयनकर्ता का मतलब है कि यह लगभग निश्चित रूप से हमेशा ऐसा करने का सबसे खराब तरीका होगा। -1 के लिए नहीं बस अपने पद को हटाने।

— स्टीफन केंडल

Answer 5

यहाँ Jquery का उपयोग किए बिना एक समाधान है

var hasClass = element.classList.contains('class name to search');
// hasClass is boolean
if(hasClass === true)
{
     // Class exists
}

संदर्भ लिंक

Comments

classList केवल IE10 +: caniuse.com/classlist में समर्थित है । आपको एक पॉलीफ़िल github.com/eligrey/classList.js जोड़ना होगा या अपने तरीके लिखने होंगे

— AFD

Answer 6

यह काफी सरल है ...

if ($('.mydivclass').length > 0) {
  //do something
}

Answer 7

divस्पष्ट रूप से तत्वों के लिए परीक्षण करने के लिए :

if( $('div.mydivclass').length ){...}

Comments

यह .mydivclassब्राउज़र और jQuery संस्करण के आधार पर थोड़ा धीमा हो सकता है।

— स्टीफन केंडल

सच है, लेकिन ओपी ने विशेष रूप से कहा "jQuery - जाँच करें कि क्या कुछ निश्चित वर्ग नाम के साथ div मौजूद है " (मेरा जोर), तो आप वास्तव में divचयनकर्ता के हिस्से को शामिल करने वाले पहले होने के लिए मेरा वोट प्राप्त करते हैं।

— टीजे क्राउडर

Answer 8

सरल कोड नीचे दिया गया है:

if ($('.mydivclass').length > 0) {
   //Things to do if class exist
}

पार्ट्यूलर आईडी के साथ div को छिपाने के लिए:

if ($('#'+given_id+'.mydivclass').length > 0) {
   //Things to do if class exist
}

Answer 9

यहाँ कुछ तरीके हैं:

1.  if($("div").hasClass("mydivclass")){
    //Your code

    //It returns true if any div has 'mydivclass' name. It is a based on the class name
    }

2. if($("#myid1").hasClass("mydivclass")){
    //Your code


    //  It returns true if specific div(myid1) has this class "mydivclass" name. 
    //  It is a  based on the specific div id's.
    }           
3. if($("div[class='mydivclass']").length > 0){
    //Your code

   // It returns all the divs whose class name is "mydivclass"
   //  and it's length would be greater than one.
    }

हम आवश्यकता के आधार पर एबोब परिभाषित तरीकों में से किसी एक का उपयोग कर सकते हैं।

Answer 10

if ($(".mydivclass").size()){
   // code here
}

size()वर्ग के साथ तत्वों की संख्या इस मामले में - विधि सिर्फ इतना है कि jQuery चयनकर्ता चयन तत्वों की संख्या देता है mydivclass। यदि यह 0 देता है, तो अभिव्यक्ति झूठी है, और इसलिए कोई भी नहीं है, और यदि यह किसी अन्य संख्या को वापस करता है, तो divs मौजूद होना चाहिए।

Comments

जब lengthसंपत्ति है तो किसी विधि को क्यों कॉल करें ? इसके अलावा, यह उस वर्ग के साथ किसी भी तत्व के लिए जांचता है , न कि केवल एक div। (अब, ओपी का मतलब क्या हो सकता है, भले ही उसने क्या कहा हो / नहीं।) स्टीफन केंडल का जवाब देखें जो ओपी ने वास्तव में कहा था (भले ही, फिर से, उनका मतलब हो सकता है कि आपने क्या किया है)।

— टीजे क्राउडर

@ टीजे क्राउडर: ठीक है, व्यक्तिगत स्वाद वास्तव में - मुझे लगता है कि आकार () विधि है - क्यों नहीं इसका उपयोग करें। एक फ़ंक्शन को कॉल करने में अतिरिक्त ओवरहेड (जब तक कि आप इसे एक लूप में 1000 बार नहीं कर रहे हैं) इतना न्यूनतम है, मैं कोड में स्पष्टता के बिट के लिए जाना चाहता हूं। आपके दूसरे बिंदु पर - हां, मैंने divभाग को हटाने के लिए अपने मूल उत्तर को दो कारणों से बदल दिया : 1) चयनकर्ता इस तथ्य के लिए बाध्य नहीं है कि ओपी एक divतत्व का उपयोग करता है (यह भविष्य में बदल सकता है), और 2) में jQuery के अधिकांश ब्राउज़र और संस्करण, AFAIK, यह तेज होना चाहिए।

— हर्मन शेफ

"मैं सिर्फ आकार महसूस करता हूं () विधि है - क्यों नहीं इसका उपयोग करें" उम, ठीक है। lengthसंपत्ति, वहाँ कारण है कि इसका इस्तेमाल नहीं? लेकिन अगर यह आपकी प्राथमिकता है, तो उचित है। दूसरे पर, मुझे नहीं पता था कि आप इसे संपादित करेंगे। अगर मैं ऐसा करने जा रहा था, तो मैंने इसे फिर से छोड़ दिया (फिर, उसने विशेष रूप से कहा "... अगर डिव के साथ ..." (मेरा जोर) और फिर इसके अतिरिक्त उल्लेख किया कि अगर यह कोई फर्क नहीं पड़ता कि क्या यह एक divया नहीं, आप उस हिस्से को खोद सकते थे। लेकिन जो भी हो। :-)

— टीजे क्राउडर

@ टीजे क्राउडर: हाँ, मुझे लगता है कि हम इसे खत्म कर रहे हैं।

— हरमन शेफ

@ टीजे क्राउडर: लेकिन मेरे बचाव में, हालांकि यह चर्चा के लिए जगह नहीं है: मुझे लगता है size()कि यह स्पष्ट करने के लिए विधि है कि आप एक jQuery चयनकर्ता में तत्वों की संख्या की गिनती कर रहे हैं, और न ही किसी भी पुराने सरणी। लेकिन फिर, यह सिर्फ मेरी प्राथमिकता है।

— हरमन शेफ

Answer 11

जांचें कि क्या div एक निश्चित वर्ग के साथ मौजूद है

if ($(".mydivclass").length > 0) //it exists 
{

}

Answer 12

if($(".myClass")[0] != undefined){
  // it exists
}else{
  // does not exist
}

Comments

इस मौजूदा उत्तर के समान प्रतीत होता है ।

— पंग

हाँ यह करता है ... लेकिन मैंने उस उत्तर की कोशिश की और यह काम नहीं किया। जब मैंने 'अपरिभाषित' की तुलना को जोड़ा तो यह पूरी तरह से काम करने लगा।

— स्टैरी

Answer 13

var x = document.getElementsByClassName("class name");
if (x[0]) {
alert('has');
} else {
alert('no has');
}

Comments

हालांकि यह कोड प्रश्न का उत्तर दे सकता है, लेकिन यह कोड क्यों और / या इस प्रश्न के उत्तर के बारे में अतिरिक्त संदर्भ प्रदान करता है, इसके दीर्घकालिक मूल्य में सुधार करता है।

— विशाल छड़वानी

Answer 14

Jquery में आप इस तरह का उपयोग कर सकते हैं।

if ($(".className")[0]){

   // Do something if class exists

} else {

// Do something if class does not exist

}

जावास्क्रिप्ट के साथ

if (document.getElementsByClassName("className").length > 0) {

// Do something if class exists

}else{

    // Do something if class does not exist

}

Answer 15

यहाँ जावास्क्रिप्ट में चेक क्लास (हैक्लास) के लिए बहुत नमूना समाधान है:

const mydivclass = document.querySelector('.mydivclass');
// if 'hasClass' is exist on 'mydivclass'
if(mydivclass.classList.contains('hasClass')) {
   // do something if 'hasClass' is exist.
}

Answer 16

जावास्क्रिप्ट में सबसे अच्छा तरीका:

if (document.getElementsByClassName("search-box").length > 0) {
// do something
}

Answer 17

अगर ($ ("# myid1")। हैक्लास ("mydivclass")) {// कोई काम करो}

Comments

कृपया अपने उत्तर के लिए कुछ स्पष्टीकरण दें

— निष्पादन योग्य

Answer 18

पूरे पृष्ठ को खोजने के लिए इसका उपयोग करें

if($('*').hasClass('mydivclass')){
// Do Stuff
}