jQuery Selectors for ASP.NET Applications
jQuery selectors use CSS syntax to allow developerts to iterate through and identify any set of ASP.NET DOM elements to operate upon with the jQuery library methods. A jQuery statement typically follows the syntax pattern:
$(selector).method();
The jQuery selector itself is a string expression that determines the identified set of DOM elements to be operated upon by the jQuery library methods. jQuery operations may also be chained:
$(selector).method1().method2().method3();
jQuery selectors by type:
| Selector | Example | Description |
|---|
* | $("*") | Selects all elements |
|---|
#id | $("#txtName") | Selects element with id = "txtName" |
|---|
.class | $(".stdLabel") | Selects all elements with the CSS class = ".stdLabel" |
|---|
.class.class | $(".stdText.stdLabel") | Selects all elements with CSS classes ".stdText" and ".stdLabel" |
|---|
element | $("div") | Selects all elements of the "div" type |
|---|
:first | $("div:first") | Selects the "first" "div" element on the page |
|---|
:last | $("div:last") | Selects the "last" "div" element on the page |
|---|
:even | $("div:even") | Selects all "even" numbered "div" elements on the page beginning at 0 |
|---|
:odd | $("div:odd") | Selects all "odd" numbered "div" elements on the page beginning at 1 |
|---|
:eq(index) | $("div:eq(6)") | Selects the 7th "div" element on a page beginning at index 0 |
|---|
:gt(index) | $("div:gt(6)") | Selects all "div" elements on a page greater than index 6 (or > 7th) |
|---|
:lt(index) | $("div:lt(6)") | Selects all "div" elements on a page less than index 6 (or < 7th) |
|---|
:not(selector) | $("input:not(:empty)") | Selects all "input" elements on page that are not empty |
|---|
| :contains(text) | $("text:contains('Jones')") | Selects all textboxes that contain "Jones" |
|---|
:empty | $("text:empty") | Selects all textboxes that are empty |
|---|
:hidden | $("text:hidden") | Selects all textboxes that are not visible |
|---|
:visible | $("text:visible") | Selects all textboxes that are visible |
|---|
:input | $(":input") | Selects all form input elements (input, select, textarea, button, etc.) |
|---|
:text | $(":text") | Selects all form textbox elements |
|---|
:password | $(":password") | Selects all form elements of type password |
|---|
:radio | $(":radio") | Selects all form elements of type radio |
|---|
:checkbox | $(":checkbox") | Selects all form elements of type checkbox |
|---|
:submit | $(":submit") | Selects all form elements of type submit |
|---|
:button | $(":button") | Selects all form elements of type button |
|---|
:enabled | $(":enabled") | Selects all form elements that are enabled |
|---|
:disabled | $(":disabled") | Selects all form elements that are disabled |
|---|
:checked | $(":checked") | Selects all form elements that are checked |
|---|
| | | |
|---|
| | |
|---|
jQuery selector Selects all elements with the given tag name
The jQuery selectors