css विधि
css विधि एलिमेंट की CSS स्टाइल प्राप्त करने
और बदलने की अनुमति देती है।
यह याद रखना महत्वपूर्ण है कि हम 'गणना किए गए
मान' प्राप्त करेंगे (computed style
properties), जो CSS स्टाइल में निर्दिष्ट लोगों से
भिन्न हो सकते हैं।
सिंटैक्स
एक गुण प्राप्त करें:
javascript$(सेलेक्टर).css(गुण);
कई गुण प्राप्त करें, पास किया गया पैरामीटर - गुण नामों की सरणी:
javascript$(सेलेक्टर).css(['width', 'height', 'color']);
एक गुण बदलें:
javascript$(सेलेक्टर).css(गुण, नया मान);
कई गुण बदलें, उन्हें ऑब्जेक्ट के रूप में पास करके,
जिसमें 'कुंजी: मान' जोड़े होते हैं। गुण का नाम
CamelCase के रूप में निर्दिष्ट किया गया है:
javascript$(सेलेक्टर).css({fontSize: '12px', color: 'red'});
या, वैकल्पिक विकल्प:
html<p class="www">text</p>javascript$('.www').css({'font-size':'12px', 'color':'red'});
हम सेट में प्रत्येक एलिमेंट पर एक निर्दिष्ट फ़ंक्शन भी लागू कर सकते हैं।
इस मामले में, फ़ंक्शन को पहले पैरामीटर के रूप में सेट में एलिमेंट की संख्या प्राप्त होगी, और दूसरे पैरामीटर के रूप में
- उस विशिष्ट एलिमेंट के लिए निर्दिष्ट CSS गुण का वर्तमान मान।
इस मामले में this
फ़ंक्शन के अंदर वर्तमान एलिमेंट की ओर इशारा करेगा।
प्रत्येक एलिमेंट का CSS गुण उस पर बदल जाएगा,
जो फ़ंक्शन उस विशेष एलिमेंट के लिए लौटाता है:
javascript$(सेलेक्टर).css(गुण का नाम, function(सेट में संख्या, CSS गुण का वर्तमान मान));
उदाहरण
आइए क्लास www वाले सभी एलिमेंट प्राप्त करें
और उनका रंग लाल में बदलें:
html<p class="www">text</p>javascript$('.www').css('color', 'red');
उदाहरण
आइए क्लास www वाले सभी एलिमेंट प्राप्त करें
और उनका रंग लाल में बदलें, और फ़ॉन्ट आकार
- 20px पर बदलें:
html<p class="www">text</p>javascript$('.www').css({color:'red', fontSize:'20px'});
या, वैकल्पिक विकल्प:
html<p class="www">text</p>javascript$('.www').css({'color':'red', 'font-size':'20px'});