क्या जरूरत है और jQuery चयनकर्ता को कैसे लिखा गया है?
एक आधुनिक वेब डिजाइनर का स्वामित्व नहीं होना चाहिएएचटीएमएल, सीएसएस और जावास्क्रिप्ट की मूल बातें, लेकिन jQuery की लाइब्रेरी में भी काम करने में सक्षम हैं, जो एचटीएमएल दस्तावेज़ों के साथ जावास्क्रिप्ट की बातचीत पर केंद्रित है। यह आपको किसी भी DOM तत्वों (प्रोग्राम इंटरफ़ेस जो HTML-फ़ाइलों की सामग्री तक पहुंच खोलता है) को तेज़ी से एक्सेस और हेरफेर करने की अनुमति देता है। इस पुस्तकालय की मुख्य संरचनात्मक इकाइयां टीम हैं। इस या उस आदेश को लागू करने के लिए, आपको एक jQuery चयनकर्ता की आवश्यकता है।
JQuery पुस्तकालय में चयनकर्ताओं का सूत्र
JQuery चयनकर्ता सीएसएस में इस्तेमाल किए गए लोगों पर आधारित हैं। उन्हें HTML-file के तत्वों का चयन करने के लिए आवश्यक है, ताकि उन्हें उपयोग करने के लिए उन्हें उपयोग करने के लिए एक या दूसरी विधि (टीम) को कॉल करने के लिए उपयोग किया जा सके। चयनकर्ता द्वारा खोज फ़ंक्शन $ () के माध्यम से की जाती है। उदाहरण के लिए, $ ("div")।
चयनकर्ताओं को तत्वों के चयन के तरीके के अनुसार वर्गीकृत किया जा सकता है:
- बुनियादी;
- विशेषता द्वारा;
- पदानुक्रम द्वारा;
- सामग्री द्वारा;
- स्थिति से;
- फॉर्म फ़ील्ड का चयन;
- अन्य शामिल हैं।
मूल चयनकर्ता
इस पुस्तकालय के साथ काम करते समय 90% मामलों में मुख्य समूह से संबंधित एक jQuery-selector का उपयोग किया जाता है। वे सभी काफी सरल और समझदार हैं। आइए उनमें से प्रत्येक पर विचार करें:
- * - पृष्ठ के सभी तत्वों का चयन करता है, जिनमें सिर, शरीर आदि शामिल हैं;
- पी / div / साइडबार / ... - दिए गए टैग से संबंधित सभी तत्वों का चयन करता है (यानी, पीडीआईवी, साइडबार, आदि);
- .myClass / p.myClass - निर्दिष्ट वर्ग नाम वाले तत्वों का चयन करता है;
- # myID / p। # myID - दिए गए आईडी के साथ एक तत्व का चयन करता है।
आइए एक उदाहरण दें। आइए मान लें कि हमें कक्षा के साथ किसी पृष्ठ के सभी तत्वों को चुनने की आवश्यकता है, प्रविष्टि इस तरह दिखेगी: $ (.par)। अगर इस वर्ग के केवल पी के तत्वों की आवश्यकता है, तो हम लिखेंगे: $ (पी.पर)।
विशेषता चयनकर्ताओं
मुख्य JQuery चयनकर्ता का उपयोग किया जा सकता है अगरहमें उस तत्व से चयन करने की आवश्यकता है जो उस वर्ग से संबंधित है जिसमें आईडी है या पृष्ठ के सभी तत्वों का चयन करें। हालांकि, ऐसे समय होते हैं जब वांछित तत्व में कक्षा या आईडी नहीं होती है। यही कारण है कि विशेषता द्वारा चयनकर्ता हैं। वे आपको HTML तत्व की कुछ विशेषता पर नमूना देने की अनुमति देते हैं, उदाहरण के लिए, href या src द्वारा। यह गुण स्क्वायर ब्रैकेट [] में लिखा गया है।
सबसे सरल उदाहरण: $ ([src]) - उन सभी तत्वों का चयन करता है जिनमें src विशेषता है। आप विशेषता को किसी विशिष्ट मान पर सेट करके नमूना क्षेत्र को संकीर्ण कर सकते हैं: $ ([src = "value"])।
आप jQuery में कई का उपयोग कर सकते हैंचयनकर्ता, यदि आवश्यक हो, तो चयन क्षेत्र को संकीर्ण करें। उदाहरण के लिए, $ (पी [रंग = नीला] [आकार = 12]) - केवल पी के उन तत्वों को नीला और आकार 12 चुना जाएगा।
सामग्री चयनकर्ताओं
यदि घटनाओं या मुख्य चयनकर्ताओं द्वारा वस्तुओं का चयन करना संभव नहीं है, तो उनकी सामग्री को संदर्भित करना उचित है। इस प्रकार के 4 चयनकर्ता हैं:
- : शामिल है - निर्दिष्ट पाठ वाले तत्वों का चयन करता है;
- : है - उन तत्वों का चयन करता है जिनमें उस पंक्ति के लिए विशिष्ट अन्य तत्व होते हैं;
- : अभिभावक - उन तत्वों का चयन करता है जिनमें कोई अन्य शामिल है;
- : खाली - उन वस्तुओं का चयन करता है जिनमें कोई अन्य शामिल नहीं है।
आइए एक उदाहरण दें। हैलो टेक्स्ट वाले सभी div तत्वों को चुनने के लिए, आपको $ (div: include ("हैलो") लिखना होगा)।
पदानुक्रम चयनकर्ताओं
JQuery में आइटम का चयन करने का एक और तरीका है,अर्थात् - उनके पदानुक्रम के अनुसार (यानी, एचटीएमएल पेज पर एक दूसरे के साथ संबंध)। उनमें से बहुत सारे हैं, इसलिए यहां दो सबसे लोकप्रिय हैं: "बच्चा" और "बच्चा।"
पहले मामले में, चयनित तत्वदिए गए तत्व (पूर्वज) के प्रत्यक्ष वंशज (बच्चे) हैं। उदाहरण के लिए, एनवी सूची के बच्चे हैं जो प्रकाश वर्ग में सूची आइटम का चयन करने के लिए, आपको लिखना होगा: $ (ul # nav> li.light)।
दूसरा मामला अधिक सामान्य है। यहां, किसी तत्व के अप्रत्यक्ष वंशज भी चुने जा सकते हैं। उदाहरण के लिए, एनएवी सूची में लिंक का चयन करने के लिए, हम लिखेंगे: $ (उल # एनए ए)।
इस प्रकार, JQuery में तत्वों विभिन्न तरीकों से मानकों का उपयोग करके इस तरह के एक वर्ग, आईडी, गुण, सामग्री या HTML दस्तावेज़ तत्वों के पदानुक्रम के रूप में चुना जा सकता है।
