JQuery addClass() विधि डेवलपर्स को अधिक वैश्विक तरीके से तत्वों को बदलने का एक तरीका देती है। जैसा कि विधि के नाम से पता चलता है, हम चयनित तत्व में एक वर्ग विशेषता जोड़ सकते हैं। हम ऐसा क्यों करना चाहेंगे?
आइए एक वेब पेज का उदाहरण लेते हैं जिसमें कुछ मौजूदा तत्व होते हैं जैसे शीर्षक, अनुच्छेद, और क्लिक करने के लिए एक बटन जो कुछ करता है। इस पृष्ठ के साथ एक स्टाइलशीट है जो इन तत्वों के वर्ग नाम का उपयोग उन्हें स्टाइल करने के लिए करती है। बटन पर क्लिक करने पर, मौजूदा सामग्री शैली, या दिखावट बदल सकती है।
हम addClass() . का उपयोग कर सकते हैं बटन क्लिक करने के बाद मौजूदा सामग्री के लिए एक नई शैली विशेषता सम्मिलित करने की विधि, जो केवल कोड की एक पंक्ति का उपयोग करके मौजूदा सामग्री की शैली को बदलना संभव बनाती है। ऐसा करने से डेवलपर को स्टाइल वाले तरीके से तत्वों में हेरफेर करने के बारे में सोचने की अनुमति मिलती है।
आइए उदाहरण की गहराई में जाएं और देखें कि हम इसे कैसे कोडित कर सकते हैं।
jQuery addClass() कैसे काम करता है
हमारे उदाहरण में, जब हमारा बटन क्लिक किया जाता है तो हम किसी ऑब्जेक्ट की क्लास एट्रिब्यूट बदल रहे होते हैं। इस उदाहरण कोड में आने से पहले, आइए एक नज़र डालते हैं कि कैसे addClass() काम करता है। मान लीजिए हमारे पास यह एचटीएमएल है:
<head>
<meta charset="utf-8">
<title>addClass demo</title>
<style>
p {
margin: 8px;
font-size: 16px;
}
.selected {
color: blue;
}
.highlight {
background: yellow;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
<p>Hello</p>
<p>and</p>
<p>Goodbye</p> हम
में अपनेटैग के लिए कुछ बुनियादी स्टाइल शामिल करने के लिए