वेनिला जावास्क्रिप्ट के साथ एक तत्व से एक वर्ग कैसे निकालें?

JavaScript क्लासलिस्ट प्रॉपर्टी के remove() से HTML एलीमेंट से क्लास को हटाना आसान है तरीका। यदि आपने पहले से ही किसी तत्व में एक वर्ग जोड़ने का तरीका पढ़ा है, तो आप महसूस करेंगे कि एक वर्ग को हटाना ठीक उसी तरह है, ठीक उल्टा।

आइए पहले सामान्य classList.remove() सूत्र को देखें - और फिर एक व्यावहारिक उदाहरण के साथ अनुवर्ती कार्रवाई करें।

सूत्र

var element = document.querySelector("selector")
element.classList.remove("class")

ऊपर दिए गए सामान्य उदाहरण में, हमें पहला HTML तत्व मिलता है निर्दिष्ट चयनकर्ता नाम . वाले पृष्ठ पर (यह एक तत्व चयनकर्ता, वर्ग चयनकर्ता, आदि हो सकता है) और एक चर के साथ इसका संदर्भ संग्रहीत करें।

फिर हम classList प्रॉपर्टी . संलग्न करते हैं remove() तत्व वस्तु (चर) के लिए विधि और उस वर्ग को निर्दिष्ट करें जिसे हम इससे हटाना चाहते हैं।

व्यावहारिक classList.remove() उदाहरण

किसी वर्ग को खोजने और निकालने के लिए, हमें स्पष्ट रूप से एक ऐसा तत्व खोजने की आवश्यकता है जिसमें एक वर्ग हो।

तो हमें किस वर्ग को हटाना चाहिए?

हमारे जीवन को आसान बनाने के लिए, मैंने अभी-अभी italic . नामक एक वर्ग जोड़ा है आप जिस पैराग्राफ को पढ़ रहे हैं। जैसा कि आप देख सकते हैं, यह टेक्स्ट को इटैलिकाइज़ करता है।

आइए ऊपर दिए गए पैराग्राफ़ को अपनी newfound classList.remove तकनीक से "अन-इटैलिकाइज़" करें:

var firstParagraph = document.querySelector(".italic")
firstParagraph.classList.remove("italic")

और परिणाम:

नोट:मेरे पास italic है मेरी वेबसाइट की CSS स्टाइलशीट में क्लास है, इसलिए यह काम करती है। कक्षा इस तरह दिखती है:

.italic {
  font-style: italic;
}

संसाधन

• एमडीएन वेब डॉक्स element.classList