jQuery — Selectors Reference
Basic Selectors
| Selector | Example | Description |
|---|---|---|
| * | $("*") | All elements |
| #id | $("#demo") | Element with id="demo" |
| .class | $(".box") | Elements with class="box" |
| element | $("p") | All p elements |
Hierarchical Selectors
| Selector | Example | Description |
|---|---|---|
| descendant | $("div p") | p inside div |
| child | $("div > p") | Direct child p |
| next | $("div + p") | Adjacent p |
| siblings | $("div ~ p") | Following p siblings |
Attribute Selectors
| Selector | Example | Description |
|---|---|---|
| [attr] | $("[href]") | Has href |
| [attr=val] | $("[type='text']") | Equals value |
| [attr!=val] | $("[type!='text']") | Not equals |
| [attr^=val] | $("[href^='https']") | Starts with |
| [attr$=val] | $("[href$='.pdf']") | Ends with |
| [attr*=val] | $("[title*='hi']") | Contains |
Filter Selectors
| Selector | Example | Description |
|---|---|---|
| :first | $("p:first") | First p |
| :last | $("p:last") | Last p |
| :eq(n) | $("p:eq(2)") | Nth (0-indexed) |
| :odd | $("tr:odd") | Odd rows |
| :even | $("tr:even") | Even rows |
| :not(s) | $("p:not(.skip)") | Not matching |
| :gt(n) | $("p:gt(2)") | Greater than index |
| :lt(n) | $("p:lt(2)") | Less than index |
Content Filters
| Selector | Description |
|---|---|
| :contains(text) | Contains text |
| :empty | No children |
| :has(selector) | Has descendant |
| :parent | Has children |
Form Selectors
| Selector | Description |
|---|---|
| :input | All form elements |
| :text | Text inputs |
| :password | Password inputs |
| :checkbox | Checkboxes |
| :radio | Radio buttons |
| :submit | Submit buttons |
| :selected | Selected options |
| :checked | Checked inputs |
| :disabled | Disabled elements |
| :enabled | Enabled elements |
Mini Practice
- Test each basic selector type
- Use attribute selectors
- Filter elements with :eq and :not
- Select form elements
Up Next
Continue with Events Reference — complete list of jQuery events.
Related Topics
Frequently Asked Questions about Selectors Reference
What is Selectors Reference in jQuery?
Selectors Reference is a fundamental concept in jQuery. This lesson explains it step by step with clear examples, making it easy for beginners to understand.
How do I learn Selectors Reference?
Start by reading the explanation above, then try the code examples. Practice by modifying the examples and experimenting with different values. Hands-on practice is the best way to learn Selectors Reference.
Why is Selectors Reference important in jQuery?
Selectors Reference is essential for jQuery development. Understanding this concept will help you write better code and solve real-world problems more effectively.