jQuery selectors

 jQuery is a JavaScript library that simplifies HTML document traversal and manipulation, event handling, and animation. jQuery selectors are a key feature of jQuery that allow you to select and manipulate elements in an HTML document. They are similar to CSS selectors and provide a powerful way to target specific elements on a web page.

Here are some common jQuery selectors:

  1. Element Selector: Selects all elements with a specified tag name.

    $("p") // Selects all <p> elements on the page
    
  2. ID Selector: Selects an element with a specific id attribute.

    $("#myId") // Selects the element with id="myId"
    
  3. Class Selector: Selects elements with a specific class.

    $(".myClass") // Selects all elements with class="myClass"
    
  4. Attribute Selector: Selects elements with a specific attribute.

    $("[name='email']") // Selects elements with name="email"
    
  5. Descendant Selector: Selects elements that are descendants of a specified element.

    $("div p") // Selects all <p> elements that are descendants of <div> elements
    
  6. Child Selector: Selects elements that are direct children of a specified element.

    $("ul > li") // Selects all <li> elements that are direct children of <ul> elements
    
  7. Parent Selector: Selects elements that are parents of a specified element.

    $("p").parent() // Selects the parent of all <p> elements
    
  8. Siblings Selector: Selects elements that are siblings of a specified element.

    $("h2").siblings() // Selects all siblings of <h2> elements
    
  9. Filter Selector: Refines the selection by filtering elements using various criteria.

    $("p").filter(".highlighted") // Selects <p> elements with the class "highlighted"
    
  10. First and Last Selector: Selects the first and last element(s) in the set.

$("li:first") // Selects the first <li> element
$("li:last") // Selects the last <li> element
  1. :even and :odd Selectors: Selects even and odd elements in a set.
$("tr:even") // Selects even <tr> elements
$("tr:odd") // Selects odd <tr> elements
  1. :not Selector: Selects elements that do not match a specified selector.
$("p:not(.special)") // Selects <p> elements that do not have the class "special"

These are just some of the many selectors available in jQuery. You can also create custom selectors and use them in your jQuery code. Selectors in jQuery are a powerful way to manipulate and interact with elements in an HTML document.

Post a Comment

0 Comments