जांचें कि क्या किसी तत्व में जावास्क्रिप्ट में एक वर्ग है?


585

सादे जावास्क्रिप्ट का उपयोग करना (jQuery नहीं), क्या यह जांचने का कोई तरीका है कि क्या किसी तत्व में एक वर्ग है?

वर्तमान में, मैं यह कर रहा हूँ:

var test = document.getElementById("test");
var testClass = test.className;

switch (testClass) {
  case "class1":
    test.innerHTML = "I have class1";
    break;
  case "class2":
    test.innerHTML = "I have class2";
    break;
  case "class3":
    test.innerHTML = "I have class3";
    break;
  case "class4":
    test.innerHTML = "I have class4";
    break;
  default:
    test.innerHTML = "";
}
<div id="test" class="class1"></div>

मुद्दा यह है कि अगर मैं इसे करने के लिए HTML बदल ...

<div id="test" class="class1 class5"></div>

... अब कोई सटीक मिलान नहीं है, इसलिए मुझे कुछ भी नहीं ( "") का डिफ़ॉल्ट आउटपुट मिलता है । लेकिन मैं अभी भी आउटपुट चाहता हूं I have class1क्योंकि <div>अभी भी वर्ग शामिल है .class1


5
element.classList.contains (cls)
रॉनी रोस्टन

जवाबों:


1034

उपयोग विधि:element.classList .contains

element.classList.contains(class);

यह सभी वर्तमान ब्राउज़रों पर काम करता है और पुराने ब्राउज़र को भी सपोर्ट करने के लिए पॉलीफिल हैं।


वैकल्पिक रूप से , यदि आप पुराने ब्राउज़रों के साथ काम करते हैं और उन्हें ठीक करने के लिए पॉलीफ़िल का उपयोग नहीं करना चाहते हैं, indexOfतो सही है, लेकिन आपको इसे थोड़ा मोड़ना होगा:

function hasClass(element, className) {
    return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1;
}

अन्यथा आप भी प्राप्त करेंगे trueयदि आप जिस वर्ग की तलाश कर रहे हैं वह किसी अन्य वर्ग नाम का हिस्सा है।

डेमो

jQuery एक समान (यदि समान नहीं है) विधि का उपयोग करता है।


उदाहरण के लिए लागू:

चूंकि यह स्विच स्टेटमेंट के साथ काम नहीं करता है, आप इस कोड के साथ समान प्रभाव प्राप्त कर सकते हैं:

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i < j; i++) {
    if(hasClass(test, classes[i])) {
        test.innerHTML = "I have " + classes[i];
        break;
    }
}

यह भी कम बेमानी है;)


बहुत बढ़िया, लेकिन मैं स्विच स्टेटमेंट के संयोजन में इसका उपयोग कैसे करूं ताकि मैं उन वर्गों के आधार पर आउटपुट को बदल सकूं जिनमें div शामिल है?
14

@ जीजीयूवाई: वैसे भी आप स्विच स्टेटमेंट के साथ क्या करना चाहते हैं? उदा। दूसरे divमें दो वर्ग हैं लेकिन यह केवल उसी तरह आउटपुट होगा I have class1जैसा आप उपयोग कर रहे हैं break। यदि आप हर वर्ग के एक तत्व का उत्पादन करना चाहते हैं, तो आप इसे ले सकते हैं classNameऔर इसे सफेद स्थानों पर विभाजित कर सकते हैं । या आपका वास्तविक लक्ष्य क्या है?
फेलिक्स क्लिंग

@ फेलिक्स क्लिंग: मुझे यह पता लगाना है कि किस वर्ग के आधार पर चार अलग-अलग तारों के बीच बदलने के लिए div के भीतर का HTML है। मैंने उदाहरण के तौर पर "I have class1", इत्यादि का उपयोग किया है - वास्तविक तार सभी अलग हैं। मैं केवल एक समय में एक स्ट्रिंग दिखा रहा हूँ, किसी भी संयोजन नहीं (इसलिए प्रत्येक मामले के बाद टूटता है)। मैं अभी भी यह काम करना चाहता हूँ भले ही मिलान वर्ग div पर कई वर्गों में से एक हो।
डेग्यु

@ फेलिक्स क्लिंग: यह किया, बहुत बहुत धन्यवाद! मैं वास्तव में कक्षाओं के नाम का उत्पादन नहीं कर रहा हूं, बल्कि चार पूरी तरह से अलग-अलग तारों में से एक है, इसलिए मैंने इसे कुछ IF / ELSE IF स्टेटमेंट के साथ थोड़ा-थोड़ा संशोधित किया है। हालांकि पूरी तरह से काम करता है।
डेग्यु

1
क्या कोई विशिष्ट कारण है कि आपने पहले और बाद में रिक्त स्थान जोड़े हैं?
Ced

93

आसान और प्रभावी उपाय है .contains विधि।

test.classList.contains(testClass);

3
containsएक element.classListसंपत्ति की विधि
user907860

7
नायब! सभी ब्राउज़र में समर्थित नहीं, अधिक जानकारी यहाँ: caniuse.com/#feat=classlist
रजत Ringvee

4
यह एक महान जवाब है और मेरा मानना ​​है कि .contains () को अब बहुत व्यापक समर्थन प्राप्त है।
निकोलस क्रेडीबर्ग

49

आधुनिक ब्राउज़रों में, आप निम्न containsविधि का उपयोग कर सकते हैं Element.classList:

testElement.classList.contains(className)

डेमो

var testElement = document.getElementById('test');

console.log({
    'main' : testElement.classList.contains('main'),
    'cont' : testElement.classList.contains('cont'),
    'content' : testElement.classList.contains('content'),
    'main-cont' : testElement.classList.contains('main-cont'),
    'main-content' : testElement.classList.contains('main-content')
});
<div id="test" class="main main-content content"></div>


समर्थित ब्राउज़र

यहाँ छवि विवरण दर्ज करें

( CanIUse.com से )


polyfill

यदि आप उपयोग करना चाहते हैं, Element.classListलेकिन आप पुराने ब्राउज़रों का भी समर्थन करना चाहते हैं, तो एली ग्रे द्वारा इस पॉलीफ़िल का उपयोग करने पर विचार करें


10

चूंकि वह स्विच का उपयोग करना चाहता है (), मुझे आश्चर्य है कि किसी ने भी इसे आगे नहीं रखा है:

var test = document.getElementById("test");
var testClasses = test.className.split(" ");
test.innerHTML = "";
for(var i=0; i<testClasses.length; i++) {
    switch(testClasses[i]) {
        case "class1": test.innerHTML += "I have class1<br/>"; break;
        case "class2": test.innerHTML += "I have class2<br/>"; break;
        case "class3": test.innerHTML += "I have class3<br/>"; break;
        case "class4": test.innerHTML += "I have class4<br/>"; break;
        default: test.innerHTML += "(unknown class:" + testClasses[i] + ")<br/>";
    }
}

1
मैं बस एक ही बात सोच रहा था, लेकिन हां, यह मूल समस्या के सबसे करीब है!
सिल्वर रिंगवे

8

Element.matches ()

element.matches (selectorString)

एमडीएन वेब डॉक्स के अनुसार :

Element.matches()विधि रिटर्न trueतत्व निर्दिष्ट चयनकर्ता स्ट्रिंग द्वारा चयनित किया जाएगा अगर; अन्यथा, रिटर्न false

इसलिए, आप यह Element.matches()निर्धारित करने के लिए उपयोग कर सकते हैं कि किसी तत्व में कोई वर्ग है या नहीं।

const element = document.querySelector('#example');

console.log(element.matches('.foo')); // true
<div id="example" class="foo bar"></div>

ब्राउज़र संगतता देखें


7

यहाँ एक छोटा सा स्निपेट है यदि आप जाटर के उपयोग के बिना एक वर्ग को शामिल करने की कोशिश कर रहे हैं, जिसमें एक तत्व शामिल है।

function hasClass(element, className) {
    return element.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(element.className);
}

यह इस तथ्य के लिए जिम्मेदार है कि तत्व में अंतरिक्ष द्वारा अलग किए गए कई वर्ग नाम हो सकते हैं।

या


आप इस फंक्शन को एलिमेंट प्रोटोटाइप में असाइन कर सकते हैं।

Element.prototype.hasClass = function(className) {
    return this.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
};

और इसे इस तरह ट्रिगर करें (jQuery के .hasClass()फ़ंक्शन के समान ):

document.getElementById('MyDiv').hasClass('active');

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

5

एक सरलीकृत ऑनलाइनर: 1

function hasClassName(classname,id) {
 return  String ( ( document.getElementById(id)||{} ) .className )
         .split(/\s/)
         .indexOf(classname) >= 0;
}

1 indexOf सरणियों के लिए IE (संभोग) द्वारा समर्थित नहीं है। उसके लिए नेट पर बहुत सारे बंदर के पैच पाए जाते हैं।


1
शब्द सीमाओं के साथ समस्या यह है कि वर्ग के नामों के लिए कुछ मान्य वर्णों -को शब्द सीमा के रूप में माना जाता है। जैसे की तलाश है fooऔर वर्ग foo-barउपज है true
फेलिक्स क्लिंग

तुम सही हो। मूल हटा दिया, एक और दृष्टिकोण जोड़ा। अभी भी एक oneliner।
KooiInc

5

यह थोड़ा पुराना है, लेकिन हो सकता है कि कोई व्यक्ति मेरे समाधान के लिए उपयोगी हो:

// Fix IE's indexOf Array
if (!Array.prototype.indexOf) {
    Array.prototype.indexOf = function (searchElement) {
        if (this == null) throw new TypeError();
        var t = Object(this);
        var len = t.length >>> 0;
        if (len === 0) return -1;
        var n = 0;
        if (arguments.length > 0) {
            n = Number(arguments[1]);
            if (n != n) n = 0;
            else if (n != 0 && n != Infinity && n != -Infinity) n = (n > 0 || -1) * Math.floor(Math.abs(n));
        }
        if (n >= len) return -1;
        var k = n >= 0 ? n : Math.max(len - Math.abs(n), 0);
        for (; k < len; k++) if (k in t && t[k] === searchElement) return k;
        return -1;
    }
}
// add hasClass support
if (!Element.prototype.hasClass) {
    Element.prototype.hasClass = function (classname) {
        if (this == null) throw new TypeError();
        return this.className.split(' ').indexOf(classname) === -1 ? false : true;
    }
}

उपयोग करें: 'element.hasClass (' classname ');
दमन २ic

आपने t.length >>> 0 का उपयोग क्यों किया? जहाँ तक मुझे पता है कि यह एक noop है यदि आप '0' का उपयोग करते हैं, है ना?
वेटर कैनोवा

कुछ सरल के लिए इतना कोड वाह। नियमित अभिव्यक्ति का उपयोग क्यों न करें और पहिए को फिर से न लगाएं? आप बस /^class_name_you_are_searching_for$/.test(myElement.className) का उपयोग कर सकते हैं
pqsk

1
मैंने लिखा कि बहुत तेज है। बस मेरे नियमित अभिव्यक्ति overcomplicate नहीं करने के लिए यह होगा /\s*class_name_you_are_searching_for\s*/.test(myElement.className)
pqsk

@pqsk - मैं भविष्य के उपयोग के लिए अपने स्वयं के पुस्तकालयों को लिखता हूं। और यह सिर्फ मेरे ढेर में जोड़ता है। बेशक अन्य समाधान काम करेंगे, यह सिर्फ मेरा पसंदीदा तरीका है
19'15

4

classNameसिर्फ एक स्ट्रिंग है ताकि आप नियमित इंडेक्सऑफ फ़ंक्शन का उपयोग करके यह देख सकें कि कक्षाओं की सूची में एक और स्ट्रिंग है या नहीं।


1
classउपरोक्त उदाहरण में कक्षा के लिए परीक्षण के बारे में क्या ?
फेलिक्स क्लिंग

6
अनुभव से, यह तरीका काफी जोखिम भरा हो सकता है: यह तब सच होगा जब आप fooकिसी ऐसे तत्व की कक्षा देखेंगे, जिसमें foobarकक्षा है।
जीरक

2
निश्चित रूप से, आपको अभी पता है कि आप क्या परीक्षण कर रहे हैं। फेलिक्स का कोड सीमांकक के रूप में रिक्त स्थान का उपयोग करके अच्छी तरह से काम करता है।
डेविड

एक वर्ग नाम के नेस्टेड उदाहरणों के लिए खाते में विफल रहता है। उदाहरण: 'अंत' वर्ग के नाम 'फ्रंटएंड' में पाया जा सकता है।
एंथनी रटलेज

4

मुझे पता है कि बहुत सारे उत्तर हैं, लेकिन इनमें से अधिकांश अतिरिक्त कार्यों और अतिरिक्त कक्षाओं के लिए हैं। यह वह है जिसे मैं व्यक्तिगत रूप से उपयोग करता हूं; बहुत क्लीनर और कोड की बहुत कम लाइनें!

if( document.body.className.match('category-page') ) { 
  console.log('yes');
}

1
यह विधि झूठी सकारात्मकता लौटा सकती है जब एक वर्ग के नाम की खोज होती है जो आंशिक रूप से मेल खाती है - जैसे <body class="category-page">और document.body.className.match('page')- मेल खाएंगे लेकिन pageतत्व से जुड़ी कोई भी कक्षा नहीं है
hooblei

इसका समाधान किया जा सकता है \b, उदाहरण के लिए /\bpage\b/g, चूंकि यह regex है (नोट: उपयोग करना है / /g)।
एंड्रयू

2

यहाँ एक मामला असंवेदनशील तुच्छ समाधान है:

function hasClass(element, classNameToTestFor) {
    var classNames = element.className.split(' ');
    for (var i = 0; i < classNames.length; i++) {
        if (classNames[i].toLowerCase() == classNameToTestFor.toLowerCase()) {
            return true;
        }
    }
    return false;
}

2

यदि तत्व में केवल एक वर्ग का नाम है, तो आप वर्ग विशेषता प्राप्त करके इसे जल्दी से देख सकते हैं। अन्य उत्तर बहुत अधिक मजबूत हैं लेकिन निश्चित रूप से इसके उपयोग के मामले हैं।

if ( element.getAttribute('class') === 'classname' ) {

}

2

मैंने एक प्रोटोटाइप तरीका बनाया है जो classListयदि संभव हो तो उपयोग करता है, अन्यथा इसके लिए रिसॉर्ट्स indexOf:

Element.prototype.hasClass = Element.prototype.hasClass || 
  function(classArr){
    var hasClass = 0,
        className = this.getAttribute('class');
  
    if( this == null || !classArr || !className ) return false;
  
    if( !(classArr instanceof Array) )
      classArr = classArr.split(' ');

    for( var i in classArr )
      // this.classList.contains(classArr[i]) // for modern browsers
      if( className.split(classArr[i]).length > 1 )  
          hasClass++;

    return hasClass == classArr.length;
};


///////////////////////////////
// TESTS (see browser's console when inspecting the output)

var elm1 = document.querySelector('p');
var elm2 = document.querySelector('b');
var elm3 = elm1.firstChild; // textNode
var elm4 = document.querySelector('text'); // SVG text

console.log( elm1, ' has class "a": ', elm1.hasClass('a') );
console.log( elm1, ' has class "b": ', elm1.hasClass('b') );
console.log( elm1, ' has class "c": ', elm1.hasClass('c') );
console.log( elm1, ' has class "d": ', elm1.hasClass('d') );
console.log( elm1, ' has class "a c": ', elm1.hasClass('a c') );
console.log( elm1, ' has class "a d": ', elm1.hasClass('a d') );
console.log( elm1, ' has class "": ', elm1.hasClass('') );

console.log( elm2, ' has class "a": ', elm2.hasClass('a') );

// console.log( elm3, ' has class "a": ', elm3.hasClass('a') );

console.log( elm4, ' has class "a": ', elm4.hasClass('a') );
<p class='a b c'>This is a <b>test</b> string</p>
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="50px">
    <text x="10" y="20" class='a'>SVG Text Example</text>
</svg>

परीक्षण पृष्ठ


क्या कोई कारण है कि आप e.className के सूचकांक के बजाय क्लास लिस्ट का उपयोग क्यों करना चाहते हैं? पर्फ़ की तरह लगता है कम अच्छे हैं
Ced

यदि आप अपनी कक्षा के लिए हजारों तत्वों का परीक्षण नहीं कर रहे हैं, तो यह ठीक है, यह अप्रासंगिक है। यह उपयोग करने के लिए अधिक सुरुचिपूर्ण है क्योंकि कोड इसकी कार्यक्षमता का वर्णन करता है, लेकिन निचला रेखा, इससे कोई फर्क नहीं पड़ता, जो कुछ भी आप चाहते हैं :)
vsync

1
  1. फ़ेलिक्स ने क्लासनेम और स्ट्रिंग को जोड़ने के लिए रिक्त स्थान जोड़ने की चाल बताई है कि यह निर्धारित करने का सही तरीका है कि तत्वों में कक्षा है या नहीं।

  2. कक्षा के अनुसार अलग-अलग व्यवहार करने के लिए, आप एक नक्शे में फ़ंक्शन संदर्भ या फ़ंक्शन का उपयोग कर सकते हैं:

    function fn1(element){ /* code for element with class1 */ }
    
    function fn2(element){ /* code for element with class2 */ }
    
    function fn2(element){ /* code for element with class3 */ }
    
    var fns={'class1': fn1, 'class2': fn2, 'class3': fn3};
    
    for(var i in fns) {
        if(hasClass(test, i)) {
            fns[i](test);
        }
    }
    • for (var i in fns) fns मैप में कुंजियों के माध्यम से पुनरावृति करता है।
    • Fnsi के बाद कोई ब्रेक नहीं होने से कोड को जब भी कोई मैच होता है, निष्पादित किया जा सकता है - ताकि यदि तत्व में फाई, क्लास 1 और क्लास 2 हो, तो fn1 और fn2 दोनों को निष्पादित किया जाएगा।
    • इस दृष्टिकोण का लाभ यह है कि प्रत्येक वर्ग के लिए कोड निष्पादित करना मनमाना है, जैसे स्विच स्टेटमेंट; आपके उदाहरण में सभी मामलों ने एक समान ऑपरेशन किया है, लेकिन कल आपको प्रत्येक के लिए अलग-अलग चीजें करने की आवश्यकता हो सकती है।
    • आप एक स्थिति चर को बताकर डिफ़ॉल्ट मामले का अनुकरण कर सकते हैं कि क्या एक मैच लूप में पाया गया था या नहीं।

1

मैं पॉली क्लासिस्ट कार्यक्षमता को भरूंगा और नए सिंटैक्स का उपयोग करूंगा। इस तरह से नया ब्राउज़र नए कार्यान्वयन (जो बहुत तेज़ है) का उपयोग करेगा और केवल पुराने ब्राउज़र ही कोड से प्रदर्शन को हिट करेंगे।

https://github.com/remy/polyfills/blob/master/classList.js


1

यह थोड़ा बंद है, लेकिन अगर आपके पास एक ऐसी घटना है जो स्विच को ट्रिगर करती है, तो आप कक्षाओं के बिना कर सकते हैं:

<div id="classOne1"></div>
<div id="classOne2"></div>
<div id="classTwo3"></div>

तुम कर सकते हो

$('body').click( function() {

    switch ( this.id.replace(/[0-9]/g, '') ) {
        case 'classOne': this.innerHTML = "I have classOne"; break;
        case 'classTwo': this.innerHTML = "I have classTwo"; break;
        default: this.innerHTML = "";
    }

});

.replace(/[0-9]/g, '')से अंक निकालता है id

यह थोडा हैक है, लेकिन बिना किसी अतिरिक्त कार्य या लूप के लंबे स्विच के लिए काम करता है


1

किसी तत्व की जाँच करने के तेज़ और आसान तरीके के लिए इस कोडपेन लिंक को देखें यदि इसमें वैनिला जावास्क्रिप्ट ~ का उपयोग करके एक विशिष्ट वर्ग है!

hasClass (वेनिला JS)

function hasClass(element, cls) {
    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}

1

यह IE8 + पर समर्थित है।

पहले हम जाँचते हैं कि classListक्या यह मौजूद है अगर हम containsIE10 + द्वारा समर्थित विधि का उपयोग कर सकते हैं । यदि हम IE9 या 8 पर हैं, तो यह रेगेक्स का उपयोग करने के लिए वापस आता है, जो उतना कुशल नहीं है, लेकिन एक संक्षिप्त पॉलीफिल है।

if (el.classList) {
  el.classList.contains(className);
} else {
  new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className);
}

वैकल्पिक रूप से यदि आप कोलाहल के साथ संकलित कर रहे हैं, तो आप बस उपयोग कर सकते हैं: el.classList.contains(className);


0

इसको आजमाओ:

document.getElementsByClassName = function(cl) {
   var retnode = [];
   var myclass = new RegExp('\\b'+cl+'\\b');
   var elem = this.getElementsByTagName('*');
   for (var i = 0; i < elem.length; i++) {
       var classes = elem[i].className;
       if (myclass.test(classes)) retnode.push(elem[i]);
   }
    return retnode;
};

1
शब्द सीमा से सावधान रहें। यह सच भी होगा यदि आपके पास एक वर्ग है foo-barऔर खोज करें foo
फेलिक्स क्लिंग

1
हाय जिमी, इसलिए मैं इस \ b मेटाचैकर की खोज कर रहा था और इसे केवल [ a-zA-Z0-9_] शब्द अक्षर मानता है । तो माइनस चार वाले क्लासनेम के लिए यह काम नहीं करेगा
स्टेनो

0

मुझे लगता है कि सही समाधान यही होगा

if ($(this).hasClass("your_Class")) 
    alert("positive");            
else              
    alert("Negative");

8
1. "सादे जावास्क्रिप्ट का उपयोग करना (jQuery का नहीं)" 2. ब्रैकेट का उपयोग करें
nkmol

3 - कोष्ठक का उपयोग करें
TheBlackBenzKid

0

वर्तमान में कक्षा '.bar' किस तत्व में है? यहाँ एक और समाधान है, लेकिन यह आपके ऊपर है।

var reg = /Image/g, // regexp for an image element
query = document.querySelector('.bar'); // returns [object HTMLImageElement]
query += this.toString(); // turns object into a string

if (query.match(reg)) { // checks if it matches
  alert('the class .bar is attached to the following Element:\n' + query);
}

jsfiddle डेमो

बेशक यह केवल 1 सरल तत्व <img>( /Image/g) के लिए एक खोज है, लेकिन आप सभी को एक सरणी में रख सकते हैं , जैसे <li>कि /LI/g, <ul>= /UL/gआदि।


0

इनलाइन एसवीजी तत्वों के भीतर वर्ग नाम खोजने की कोशिश कर रहे लोगों के लिए बस उत्तर में जोड़ने के लिए।

hasCLass()फ़ंक्शन को इसमें बदलें :

function hasClass(element, cls) {
    return (' ' + element.getAttribute('class') + ' ').indexOf(' ' + cls + ' ') > -1;
  }

classNameसंपत्ति का उपयोग करने के बजाय आपको getAttribute()वर्ग नाम को हथियाने के लिए विधि का उपयोग करना होगा ।


0

मैंने अपनी वेबसाइट के लिए ये फ़ंक्शन बनाए हैं, मैं केवल वेनिला जावास्क्रिप्ट का उपयोग करता हूं, शायद यह किसी की मदद करेगा। पहले मैंने कोई HTML तत्व प्राप्त करने के लिए एक फंक्शन बनाया:

//return an HTML element by ID, class or tag name
    var getElement = function(selector) {
        var elements = [];
        if(selector[0] == '#') {
            elements.push(document.getElementById(selector.substring(1, selector.length)));
        } else if(selector[0] == '.') {
            elements = document.getElementsByClassName(selector.substring(1, selector.length));
        } else {
            elements = document.getElementsByTagName(selector);
        }
        return elements;
    }

तब वह फ़ंक्शन जो हटाने के लिए कक्षा को हटाता है और तत्व का चयन करता है:

var hasClass = function(selector, _class) {
        var elements = getElement(selector);
        var contains = false;
        for (let index = 0; index < elements.length; index++) {
            const curElement = elements[index];
            if(curElement.classList.contains(_class)) {
                contains = true;
                break;
            }
        }
        return contains;
    }

अब आप इसे इस तरह से उपयोग कर सकते हैं:

hasClass('body', 'gray')
hasClass('#like', 'green')
hasClass('.button', 'active')

आशा है कि यह मदद करेगा।


0

युक्ति: अपनी परियोजनाओं में jQuery की निर्भरता को जितना हो सके दूर करने का प्रयास करें - VanillaJS

document.firstElementChildरिटर्न <html>टैग तो classListविशेषता यह करने के लिए जोड़ा सभी वर्गों देता है।

if(document.firstElementChild.classList.contains("your-class")){
    // <html> has 'your-class'
} else {
    // <html> doesn't have 'your-class'
}

-1

मेरे लिए इसे प्राप्त करने का सबसे सुंदर और तेज़ तरीका है:

function hasClass(el,cl){
   return !!el.className && !!el.className.match(new RegExp('\\b('+cl+')\\b'));
}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.