# 09: गेटर्स एंड सेटर्स - सीएसएस-ट्रिक्स

Anonim

जावास्क्रिप्ट में बसने और बसने की अवधारणा उन चीजों में से एक है जिन्हें आपको समझना चाहिए। वे jQuery में अच्छे हैं क्योंकि एपीआई इतना सुसंगत है कि एक बार जब आप इसे प्राप्त करते हैं, तो आप बहुत अधिक अनुमान लगा सकते हैं कि यह विभिन्न तरीकों से कैसे काम करने वाला है। सबसे बुनियादी स्तर पर ...

सेटर्स कुछ करते हैं।
गेटर्स एक मान लौटाते हैं ।

अक्सर एक ही तरीके का इस्तेमाल किया जा सकता है। उदाहरण के लिए ऊंचाई की विधि लें।

// Used as a "setter" - will set the height $("#example").height(100); // Used as a "getter" - will return a value var theHeight = $("#example").height();

फर्क देखें? जब विधि का उपयोग किया जाता है तो सेटर एक पैरामीटर पास करता है। पाने वाला कुछ नहीं करता है । इस तरह से jQuery खुद जानता है कि क्या करना है। यह सिर्फ परीक्षण करता है कि वहां कोई पैरामीटर है या नहीं। यदि नहीं, तो यह एक गटर की तरह व्यवहार करता है। यदि यह वहाँ है, यह एक सेटर की तरह व्यवहार करता है। GetHeight और setHeight जैसे अलग-अलग तरीकों के बजाय यह केवल एक अच्छा एपीआई सुविधा है।

यह ध्यान देने योग्य है कि अपने द्वारा उपयोग किया जाने वाला एक गटर कुछ भी नहीं करता है।

// Useless $("#example").height();

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

// x will be a jQuery object containing #example var x = $("#example").height(100);

यह एक बाल भ्रामक हो सकता है, लेकिन कोड बचाने के लिए एक छोटी सी चाल भी है। यदि आप जानते हैं कि आपको उस jQuery ऑब्जेक्ट दोनों को कैश करने की आवश्यकता है और इसकी ऊंचाई निर्धारित है, तो यह कोड की एक पंक्ति में भी कर सकता है।

पेन को देखें 8ff68485673396d452f650bfb437fb2a क्रिस कॉयियर (@chriscoyier) द्वारा CodePen पर

लेख में भी उल्लेख किया गया है box-sizing: border-box;। बॉक्स साइजिंग एक सुपर उपयोगी सीएसएस संपत्ति है। मैं सभी तत्वों पर इसे स्थापित करने का एक बड़ा प्रस्तावक हूं, जैसे:

* ( box-sizing: border-box; )

जैसा कि वीडियो में कहा गया है, यह height()jQuery में थोड़ा अधिक पूर्वानुमान और सुसंगत बनाता है। बॉर्डर-बॉक्स सेट के बिना, height()सीएसएस में ऊंचाई की संपत्ति के बराबर है, या स्वाभाविक रूप से जो भी ऊंचाई है, वह पैडिंग और बॉर्डर को घटाता है। border-boxसेट के साथ , height()यह वास्तव में कितना ऊंचाई है कि तत्व स्क्रीन पर ले जाता है, जिसमें पैडिंग और बॉर्डर शामिल हैं। border-boxसेट के बिना , इसे पाने के लिए, आपको outerHeight()jQuery में उपयोग करने की आवश्यकता है ।