JQuery selector is a function which is used to locate elements in a web page. JQuery selector uses expressions to locate the web elements. Expression to find a particular element is written inside "$()". Mainly jQuery selector uses any one out of 3 parameters to locate a particular web element. Those parameters are:
1. Selecting elements using ID:
$('#testID') : Selects the element in the web page which has an ID "testID"
2. Selecting element using class:
$('.testClass') : Selects the element which has class "testClass"
3. Selecting element using tag name:
$('h') : Selects all h(heading tag) in the document.
You will be familiar with jQuery selector if you have some knowledge of CSS selectors.
Some examples of jQuery selector:
1. $("*") : Selects all the elements in the document.
2. $("li.demoClass") : Selects all the "li" elements who has class "demoClass"
3. $("li:first") : Selects the first "li" element
4. $("p ul:first") : Selects the first "ul" element of the parent "p"
5. $("p[name]") : Selects all the "p" element with the attribute "name"
6. $("p[name='test']") : Selects all the "p" element with the "name" attribute value equal to "test"
7. $("p:contains('demo text')") : Selects all the "p" elements containing the text "demo text"
Selecting child node:
For example:
1. $("p#id1 > li.demoClass") :
Selects the "li" elements with class "demoClass" and who is the child of the "p" element ("p" element with id "id1")
2. $("p li") : Selects all the "li" inside the "p" element.
3. $("p:first-child") : Selects the first item in all the "p" tag
4. $("p:last-child") : Selects the last item in all the "p" tag
5. $("p:nth-child(n)") : Selects the "n"th number of item in all the "p" tag
0 Comment(s)