jquery中filter()和find()函数区别

天大地大妈咪最大 提交于 2019-12-04 09:24:24

通常把这两个函数,filter()函数和find()函数称为筛选器。

下面的例子分别使用filter函数和find函数对一组列表进行筛选操作。

一组列表:

1 <li>1</li>
2 <li class="f">2</li>
3 <li><a>3</a></li>
4 <li>4</li>
5 <li>5</li>

filter()函数

1 $('li').filter('.f').addClass('filter');

find()函数

1 $('li').find('a').addClass('find');

完整的html代码:

 1 <html>
 2     <head>
 3         <title>filter和find函数</title>
 4         <script src="jquery.js"></script>
 5     </head>
 6     <body>
 7         <li>1</li>
 8         <li class="f">2</li>
 9         <li><a>3</a></li>
10         <li>4</li>
11         <li>5</li>
12     </body>
13     <script>
14         $('li').filter('.f').addClass('filter');
15         $('li').find('a').addClass('find');
16     </script>
17 </html>

在chrome浏览器中,运行效果如下:

 1 <html><head>
 2         <title>filter和find函数</title>
 3         <script src="jquery.js"></script>
 4     </head>
 5     <body>
 6         <li>1</li>
 7         <li class="f filter">2</li>
 8         <li><a class="find">3</a></li>
 9         <li>4</li>
10         <li>5</li>
11     
12     <script>
13         $('li').filter('.f').addClass('filter');
14         $('li').find('a').addClass('find');
15     </script>
16 </body></html>

filter()函数从li标签中筛选出含有类f的li标签,推测是在同级筛选。

find()函数从li标签中找到a标签,推测是在后代中查找。

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!