Mar 3, 2014

jQuery Selector, Filter, Content Filter, Form Filter

Selectors

$('[attr]') Selects elements that have an attribute called attr, irrespective of the attribute value

$('[attr]="val"') Selects elements that have an attr attribute whose value is val

$('[attr]!="val"') Selects elements that have an attr attribute whose value is not val

$('[attr]^="val"') Selects elements that have an attr attribute whose value starts with val

$('[attr]~="val"') Selects elements that have an attr attribute whose value contains val

$('[attr]$="val"') Selects elements that have an attr attribute whose value ends with val

$('[attr]|="val"') Selects elements that have an attr attribute whose value is val or starts
with val followed by a hyphen (val-)


e.g:

$(document).ready(function () {
$('td + td').addClass("highlight");
});
 
 --------------------------------------------------------------------------------------------------------


Filters

:eq(n) Selects the nth item in the selection, using a zero-based index

:even:odd Selects the even-numbered or odd-numbered elements

:first:last Selects the first or last element

:gt(n):lt(n) Selects all the elements whose index relative to their siblings is greater
or less than n

:header Selects all elements that are headers (h1, h2, and so on)

:not(selector) Selects all the elements that do not match the selector


e.g:

$(document).ready(function () {
$('tr:eq(1)').addClass("highlight");
});



---------------------------------------------------------------------------------------------------------------

Content Filters

:contains('text') Selects elements that contain text or whose children contain text

:has('selector') Selects elements that have at least one child element that matches selector

:empty Selects elements that have no child elements

:parent Selects elements that have at least one other element

:first-child Selects elements that are the first child of their parent

:last-child Selects elements that are the last child of their parent

:nth-child(n) Selects elements that are the nth child of their parent, using a one-based index

:only-child Selects elements that are the only child of their parent


e.g:

$(document).ready(function () {
$('tr:has(td:contains("Kili"))').addClass("highlight");
});

-------------------------------------------------------------------------------------------------------------------


Form Filters

 :button Selects button elements and input elements whose type is button

:checkbox Selects check boxes

:checked Selects check boxes and radio button elements that are checked

:disabled:enabled Selects items that are enabled or disabled, respectively

:input Selects input elements

:password Selects password elements

:radio Selects radio buttons

:reset Selects input elements whose type is reset

:selected Selects option elements that are selected

:submit Selects input elements whose type is submit

:text Selects input elements whose type is text

e.g:

$(document).ready(function () {
$(':button').addClass("highlight");
});

-------------------------------------------------------------------------------------------------------------



No comments:

Post a Comment