jQuery Selectors In Hindi

If tutorials available on this website are helpful for you, please whitelist this website in your ad blocker😭 or Donate to help us ❤️ pay for the web hosting to keep the website running.

Selectors , jQuery Library का सबसे important part है , Selectors का use करके ही DOM (Document Object Model) Element (such as <div>, <p>, <span> etc..) को manipulate किया जाता है।

jQuery में भी DOM Element (HTML Elements) को ठीक बैसे ही select किया जाता है जैसे CSS में करते हैं। Elements select करने के लिए $() का use करते हैं।

jQuery में Elements select list कुछ इस प्रकार है -

• Element Selector

• Class Selector

• Id Selector

• Multiple Selector

• Universal Selector
  

jQuery Element Selector

jQuery में Elements select करने के लिए CSS की तरह direct element के name (such as </p> , <div> , <span> , <p>) से select करते हैं।

For Example

$('p'); /*selects all <p></p> elemnt of cusrrent page */
$('div'); /*selects all <div></div> elemnt of cusrrent page */
$('a'); /*selects all <a></a> elemnt of cusrrent page */
$('span'); /*selects all <span></span> elemnt of cusrrent page */
$('ul'); /*selects all <ul></ul> elemnt of cusrrent page */
$('li'); /*selects all <li></li> elemnt of cusrrent page */

jQuery Class Selector

किसी element में दी गयी class के according element select करने के लिए $('.className') use किया जाता है।

$('.myClass'); /*selects all elemnts that have myClass */
$('p .myClass'); /*selects all <p class="myClass"></p> elemnts that have myClass */

jQuery Id Selector

jQuery में हम किसी element में दी गयी Id का name use करके उस element को select करते हैं , यह सिर्फ single element को select करता है , क्योंकि Id Unique होती है और एक Id हम किसी एक element में ही दे सकते हैं।

$('#myId'); /*selects a single elemnt that have myId */
$('div #myId'); /*select particular <div id="myId"></div> elemnt that have myId */

jQuery Multiple Selectors

jQuery में multiple elements select करने के लिए ठीक CSS की तरह comma separated elements name / class names / Id देते हैं।

$('p, div, a, span'); /*selects all <p></p> , <div></div> , <a></a> , <span></span> of current document */
$('.class1, .class2, .class3'); /*selects all elemnts of current document that have .class1, .class2, .class3 class */
$('#Id1, #Id2, #id3'); /*selects all elemnts of current document that have #Id1, #Id2, #id3 Id */

jQuery Universal Selector

jQuery में Current Document के सभी elements को select करने के लिए $('*') use करते हैं , जो कि Current Document के सभी elements return करता है।

$('*'); 

तो कुछ इस तरह से jQuery में DOM (Document Object Model) Elements select करते हैं , जो कि JavaScript में DOM Elements select करने से काफी easy है।

Select किये गए DOM element / elements का object return करता है हिसे हम one by one या एक साथ manipulate कर सकते हैं।

Next Topic में हम पढ़ेंगे कि किस तरह से DOM Elements को select करके document को traverse / manipulate करते हैं।

$('p').text('my dynamic text');