Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
  • jQuery selectors

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 441
    Comment on it

    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)

Sign In

Sign up using

Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: