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.

Ask Questions?    Discuss: jQuery filters  

Post your Comment

Your Name (*) :

Your Email :
Subject (*):
Your Comment (*):
 
 
 

Comments

tanya
July 13, 2012
question

---

Hello, i was reading some jquery articles here..You have a greate database of tutorials. Congratulations ! I was wondering on these few rows. You say: /* 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. */ The way i understand this filter I would say that ("tr:gt(3)") will dive me rows grater then 3, in fact the only one with index grater than 3 is 4. AND ("tr:lt(3)") will give me rows 2,1 and 0. Am i mistaken ???? Meanwhile have a nice day and again thanks a lot for your tutorials.