Content Filter

The Content Filter filters the Dom Elements according to the content. Given below the types of content filters :

: contains() Selector

It filters the elements which have the matched text.

Example :

<script>$("div:contains('Ankit')").css("text-decoration", "underline");</script>

It filters the div which have 'Ankit' as text and underline them.

: empty Selector

It filters the elements which are empty. Here empty means they don't have children or text.

Example :

<script>$("td:empty").text("Was empty!").css('background', 'rgb(255,220,200)');</script>

It filters all the 'td' element which don't have any child or text and fill it with text "Was empty" and change it's background color.

:has() Selector

It filters the elements which contains the element provided to ' has() '.

Example :

<script>$("div:has(p)").addClass("test");</script>

It filters all the 'div' elements which have 'p' (paragraph) inside it and add the css class 'test' to it.

: parent Selector

It selects all the elements that have at least one child including text .

Example : (ContentFilter.html)

<!DOCTYPE html>
<html>
<head>
<style>
td { width:40px; background:green; }
</style>
<script src="jquery-1.4.2.js"></script>
</head>
<body>
<table border="1">

<tr><td>Ankit</td><td></td></tr>
<tr><td>Vinita</td><td></td></tr>

</table>
<script>$("td:parent").fadeTo(1500, 0.3);</script>
</body>
</html>

Output :

Learn from experts! Attend jQuery Training classes.

Ads

Content Filter

Content Filter

Content Filter

Spring Framework Training

R Programming Training

Content Filter