find()
searches through all the child elements in the matched set.Description:
Get the descendants of each element in the current set of matched elements, filtered by a selector.
Syntax
.find( selector )
selector: A string containing a selector expression to match elements against.
.find( jQuery object )
jQuery object: A jQuery object to match elements against.
.find( element )
element: An element to match elements against.
filter()
searches through all elements in the matched set.Description:
Reduce the set of matched elements to those that match the selector or pass the function's test.
Syntax
.filter( selector )
selector: A string containing a selector expression to match the current set of elements against.
.filter( function(index) )
function(index): A function used as a test for each element in the set. this is the current DOM element.
.filter( element )
element: An element to match the current set of elements against.
.filter( jQuery object )
jQuery object: An existing jQuery object to match the current set of elements against.
Example
<html>
<head>
<script src="jquery_1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function filter_month(obj){
jQuery('div').css('background','white');
jQuery('div').filter(obj).css('background', '#83AFF8');
}
function find_month(obj){
jQuery('div').css('background','white');
jQuery('div').find(obj).css('background', '#83AFF8');
}
</script>
</head>
<body>
<div id="months">
<table>
<tr>
<td> January </td>
<td> February </td>
<td> March </td>
<td> April </td>
</tr>
<tr>
<td> May </td>
<td> June </td>
<td> July </td>
<td> August </td>
</tr>
<tr>
<td> September </td>
<td> October </td>
<td> November </td>
<td> December </td>
</tr>
</table>
</div>
<div>
<b> Category</b>
<div id="months"> Month </div>
<div id="weeks"> Weeks </div>
</div>
<input onclick = "filter_month('#months');" type = "button" value ="Filter" />
<input onclick = "find_month('#months');" type = "button" value ="Find" />
</body>
</html>
| January | February | March | April |
| May | June | July | August |
| September | October | November | December |
Category
Month
Weeks
Awesome beena ... !!! keep the good work...
ReplyDeleteThanks... helpful stuff
ReplyDeletenice
ReplyDeletegreat
ReplyDeleteThis find vs filter in JavaScript comparison is very clear! The explanation of when to use each method — find for returning a single element and filter for returning all matches — is very practical for developers. Understanding these array methods is essential for efficient data manipulation. For Bangalore professionals seeking quality tech education, there's a dedicated AI training center in Electronic City Bangalore offering comprehensive programs. Great tutorial — very useful for JavaScript developers!
ReplyDelete