jQuery कुछ भी चुन सकता है जो CSS3 का चयन कर सकता है। लेकिन यह वहाँ बंद नहीं करता है! कई अतिरिक्त चयनकर्ता हैं जो jQuery के प्रस्ताव (Sizzle चयनकर्ता इंजन के माध्यम से) हैं जो कभी-कभी बहुत उपयोगी होते हैं। उदाहरण के लिए, CSS में विशेषता चयनकर्ता होते हैं जो आपको किसी भी मनमाने ढंग से विशेषता के आधार पर एक तत्व का चयन करने की अनुमति देता है। उदाहरण के लिए:
एक CSS चयनकर्ता है जिसे हम jQuery में उपयोग कर सकते हैं उसे चुनने के लिए:
$("(data-whatever='elephant-eyeballs')");विशेषता चयनकर्ता पर भिन्नताएं होती हैं, जैसे कि =आप ^="इस मान से शुरू होता है" इंगित करने के लिए कर सकते हैं । लेकिन किसी कारण से, सीएसएस के पास नहीं है! = या "इस मूल्य के बराबर नहीं"। jQuery करता है! यह jQuery चयनकर्ता एक्सटेंशन का एक उदाहरण है।
इन चयनकर्ता एक्सटेंशन के बहुत सारे हैं। कुछ हम विशेष रूप से इस स्क्रीनकास्ट में बात करते हैं:
- : eq () - a-indexed version of: nth-child ()
- : सम - शॉर्टकट के लिए: nth-child (सम)
- : gt (n) - n से अधिक इंडेक्स वाले तत्वों का चयन करें। इसके अलावा अधिक जटिल के लिए एक शॉर्टकट: nth-child () forumla।
संभवतः सभी का सबसे उपयोगी चयनकर्ता विस्तार है: () - जो उन तत्वों के चयन को सीमित करता है जिनमें आप इस छद्म चयनकर्ता को पास करते हैं (या क्या यह एक छद्म छद्म चयनकर्ता है :) :) यह संभावना है कि किसी दिन सीएसएस भविष्य में कुछ ऐसा होगा यह हमारे लिए (मुझे लगता है कि यह जैसा है pre ! code), लेकिन यह एक लंबा रास्ता तय करना है। दुर्भाग्य से मैं इस स्क्रैंकेस्ट में इसके लिए एक बहुत ही सम्मोहक तर्क नहीं देता, लेकिन जब आपको इसकी आवश्यकता होगी, तब आपको पता चल जाएगा! उदाहरण के लिए, "सभी का चयन करें। है कि एक h3.sports- बार होते हैं" - इस तरह की बात।
आप चाहें तो अपना चयन एक्सटेंशन भी कर सकते हैं। यहाँ उस पर एक लेख है। उदाहरण यह बनाना है :inviewकि वर्तमान स्क्रॉल स्थिति में पृष्ठ पर दिखाई देने पर ही कोई तत्व का चयन होता है। यह इस तरह होगा:
jQuery.extend(jQuery.expr(':'), ( inview: function (el) ( var $e = $(el), $w = $(window), top = $e.offset().top, height = $e.outerHeight(true), windowTop = $w.scrollTop(), windowScroll = windowTop - height, windowHeight = windowTop + height + $w.height(); return (top > windowScroll && top < windowHeight); ) ));