The jQuery filters enhance jQuery selectors by providing additional logic. And this actually sharpen the power of selectors.

jQuery filters

     

jQuery filters

What is jQuery filters ?

The jQuery filters enhance jQuery selectors by providing additional logic. And this actually sharpen the power of selectors.

Lets start with some basic filters for example :

• The odd and even filters- find odd and even elements(zero-indexed)
• Lets say a table with  5 rows
• :gt & :lt They stands for greater than or less than.
• :gt gives you children greater than index .
• :lt gives you children lesser than index.
•  Lets the table with 5 rows have elements(0,1,2,3,4).
• ("tr:gt(3)") will gives rows 3 & 4.
• ("tr:lt(3)") will gives rows 0 & 1.

Types of jQuery filter

Some of the main types are :

• Basic filter
• Child filter
• Content filter
• Visibility filter.

Uses of JQuery filter

Some of the key uses are given below :

• It is very similar to selector in fact we can say that it is a type of selector to enhance the functionality of selector.
• We can select filter according to their position.
• We can select filter according to tag name.
• We can select filter according to child, last-child ,nth child ,only child.
• We can select filter according to their visibility.
• We can select filter according to sibling, adjacent, or descendant etc.

Use of jQuery attribute filters

Using jQuery attribute filters make it easy to select and modify particular attributes in your html DOM.

Given below is the demonstration how you can apply filters on attribute ,here we are using "a href " attribute of html DOM :

• Using it , you can hide all the link in your html page as : $("a[href]").toggle();.
• But if you want to hide one link , you can do it as : $("a[href='http://www.ai.com/']").toggle();
• If you want to hide the link which has "google" in href.
• You can also hide the links which ends with "org" as  $("a[href$='org']").toggle();
• You can also hide the link which starts like " http://doc " as : $("a[href^='http://docs']").toggle();

 

Learn from experts! Attend jQuery Training classes.

Related Tags for jQuery filters:

More Tutorials from this section

• jQuery - jQuery Tutorials and examples
• jQuery UI Widget : Accordion
• Creating custom animations in jQuery
• Example code of jQuery animation
• Tabs
• Use of jQuery attribute filters
• jQuery to Auto Image Scroller
• jQuery UI Widget : Autocomplete
• autogeneratetext
• autogeneratetextFixed
• Auto generate text
• Tabs
• Tabs
• jQuery Example, jQuery to Retrieve Server's Current Time, jQuery Server time
• jCarousel Examples
• Basic Filter
• Binding and unbinding events
• jQuery UI Widget : Button
• Tabs
• jQuery To callback tabs