jQuery selectors
Selectors are the main part of the jQuery .
Before using the jQuery, First of all we should learn about the CSS methods.
Then only we can easily understand the selectors in jQuery.
Selectors can be divided into many categories. They are,
S.No | Selector | Description | Example |
---|---|---|---|
*
|
It is used to select all the elements. | Try | |
.class
|
It is used to select the particular element with the specified class value. Dot(.) is used to access the class value. | Try | |
#idValue
|
It is used to select the particular element with the specified class value. Dot(. is used to access the class value. | Try | |
#idValue1,#idValue2,...n
|
It is used to select more than one elements with specified id values. | Try | |
#idValue1 #idValue2 ...n
|
It is used to select a particular child of an element. #idValue1 specify the root element, #idValue2 specify the child element of #idValue1. | Try | |
.classValue1,.classValue2,...n
|
It is used to select more than one elements with specified class values. | Try | |
.classValue1 .classValue2 ...n
|
It is used to select a particular child of an element. #idValue1 specify the root element, #idValue2 specify the child element of #idValue1. | Try | |
.classValue1>.classValue2
|
It is used to select the child element only if it has the particular parent element. .classValue1 specify the parent element, .classValue2 specify the child element of .classValue1. | Try | |
.classValue1+.classValue2
|
It is used to select a single element which immediately follows the specified element. | Try | |
.classValue1~.classValue2
|
It is used to select a single element which immediately precedes the specified element. | Try | |
[attributeName]
|
It is used to select all the elements which has the specified attribute name. | Try | |
[attributeName=value]
|
It is used to select all the elements which has the specified exact value in the attribute. | Try | |
[attributeName*=value]
|
It is used to select all the element if the attribute value contains the given text. | Try | |
[attributeName~=value]
|
It is used to select all the element if the particular value is present as a word in the specified attribute. | Try | |
[attributeName^=value]
|
It is used to select all the element if the attribute value starts with the given text. | Try | |
[attributeName|=value]
|
It is used to select all the element if the attribute value starts with the given text, also other word can follow it separating both by hyphen (-). | Try | |
[attributeName$=value]
|
It is used to select all the element if the attribute value ends with the given text. | Try | |
:checked
|
It is used to select all the checked element (radio & check box). | Try | |
:disabled
|
It is used to select all the disabled elements. | Try | |
:empty
|
It is used to select all empty elements. | Try | |
:enabled
|
It is used to select all the enabled elements. | Try | |
:first-child
|
It is used to select the first child element. | Try | |
:first-of-type
|
It is used to select the first element of all its sibling elements. | Try | |
:focus
|
It is used to select the focused element. | Try | |
:hover
|
It is used to select the specified element if the mouse hovers over it. | Try | |
:in-range
|
It is used to select the specified element if the value is within the given range. | Try | |
:invalid
|
It is used to select the specified element if the given value is invalid. | Try | |
:lang(language)
|
It is used to select the specified element if the given value matches the lang attribute value. | Try | |
:last-child
|
It is used to select the last child element of a parent element and the last of all the given element. | Try | |
:last-of-type
|
It is used to select the last child element of a parent element and the last element. | Try | |
:link
|
It is used to represent a link. | Try | |
:not(selector)
|
It is used to select all the elements except the given element. | Try | |
:nth-child(n)
|
It is used to select the element by the given value. | Try | |
:nth-of-type(n)
|
It is used to select the element in the specified position, if it is inside the parent element or outside. | Try | |
:only-of-type
|
It is used to select the child from the parent element, only if the specified element occur once. | Try | |
:only-child
|
It is used to select the child of an element if doesn't have any other child. | Try | |
:optional
|
It is used to select the elements which doesn't have required attribute. | Try | |
:out-of-range
|
It is used to select the specified element if the value is outside the given range. | Try | |
:read-only
|
It is used to select the element which has readonly attribute in it. | Try | |
:read-write
|
It is used to select the element which doesn't have readonly attribute in it. | Try | |
:required
|
It is used to select the element which has required attribute in it. | Try | |
:root
|
It is used to select the highest-level "parent" element. It is used to represent element. | Try | |
:valid
|
It is used to select the element which are validated successfully. | Try |