jQuery CSS क्लास प्राप्त करना और सेट करना

jQuery के द्वारा, CSS एलिमेंटों पर काम करना बहुत आसान है。

jQuery CSS काम

jQuery के पास CSS काम करने की कई विधियाँ हैं. हम नीचे दिए इन विधियों को सीखेंगे:

  • addClass() - चुने हुए एलिमेंटों पर एक या अनेक क्लास जोड़ना
  • removeClass() - चुने हुए एलिमेंटों से एक या अनेक क्लास हटाना
  • toggleClass() - चुने हुए एलिमेंटों पर क्लास को जोड़ना या हटाना
  • css() - स्टाइल गुण को सेट करना या उसे लॉड करना

उदाहरण स्टाइल तालिका

नीचे दिए स्टाइल तालिका, इस पृष्ठ के सभी उदाहरणों के लिए उपयोग की जाएगी:

.important
{
font-weight:bold;
font-size:xx-large;
}
.blue
{
color:blue;
}

jQuery addClass() विधि

नीचे दिए उदाहरण में, कैसे विभिन्न एलिमेंटों पर क्लास गुण जोड़ा जाता है, देखें. जब क्लास जोड़ते समय, आप कई एलिमेंटों को भी चुन सकते हैं:

उदाहरण

$("button").click(function(){
  $("h1,h2,p").addClass("blue");
  $("div").addClass("important");
});

अपने आप साबित कीजिए

आप यहाँ addClass() विधि में भी कई क्लासों को निर्दिष्ट कर सकते हैं:

उदाहरण

$("button").click(function(){
  $("#div1").addClass("important blue");
});

अपने आप साबित कीजिए

jQuery removeClass() विधि

नीचे दिए उदाहरण में, विभिन्न एलिमेंटों से निर्दिष्ट क्लास गुण हटाने के लिए कैसे किया जाता है, देखें:

उदाहरण

$("button").click(function(){
  $("h1,h2,p").removeClass("blue");
});

अपने आप साबित कीजिए

jQuery toggleClass() विधि

नीचे दिए उदाहरण में jQuery toggleClass() विधि का उपयोग कैसे किया जाता है, इसे देखें: इस विधि द्वारा चुने हुए एलिमेंटों पर क्लास को जोड़ना या हटाना किया जाता है:

उदाहरण

$("button").click(function(){
  $("h1,h2,p").toggleClass("blue");
});

अपने आप साबित कीजिए

jQuery css() विधि

हम अगले अध्याय में jQuery css() विधि को समझाएंगे。

jQuery HTML संदर्भ पुस्तिका

यदि आप jQuery CSS विधियों के पूर्ण सामग्री के बारे में जानना चाहते हैं, तो हमारे jQuery CSS का संदर्भ पुस्तिका