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

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

一组列表：

 <li>1</li>

 <li class="f">2</li>

 <li><a>3</a></li>

 <li>4</li>

 <li>5</li>

filter()函数

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

find()函数

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

完整的html代码：

 <html>

     <head>

         <title>filter和find函数</title>

         <script src="jquery.js"></script>

     </head>

     <body>

         <li>1</li>

         <li class="f">2</li>

         <li><a>3</a></li>

         <li>4</li>

         <li>5</li>

     </body>

     <script>

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

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

     </script>

 </html>

在chrome浏览器中，运行效果如下：

 <html><head>

         <title>filter和find函数</title>

         <script src="jquery.js"></script>

     </head>

     <body>

         <li>1</li>

         <li class="f filter">2</li>

         <li><a class="find">3</a></li>

         <li>4</li>

         <li>5</li>

     <script>

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

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

     </script>

 </body></html>

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

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

jquery中filter()和find()函数区别的更多相关文章

  1. 【jQuery】【转】jQuery中filter()和find()的区别

    Precondition: 现在有一个页面,里面HTML代码为: <div class="css"> <p class="rain">测 ...

  2. jquery中attr()与prop()函数用法实例详解(附用法区别)

    本文实例讲述了jQuery中attr()与prop()函数用法.分享给大家供大家参考,具体如下: 一.jQuery的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是a ...

  3. jquery 中 html与text函数的区别

    jquery 中 html与text函数的区别 共同点:它们都能讲函数中的参数渲染到页面中: 异同点: text() 只是简单的讲参数的内容写入到页面中: html() 会根据参数的值,判断是否字体符 ...

  4. 【jQuery】【转】jQuery中的trigger和triggerHandler区别

    trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...

  5. JQuery中的html(),text(),val()区别

    jQuery中.html()用为读取和修改元素的HTML标签,.text()用来读取或修改元素的纯文本内容,.val()用来读取或修改表单元素的value值. 1.HTML html():取得第一个匹 ...

  6. 基于jquery中children()与find()的区别介绍

    本篇文章介绍了,基于jquery中children()与find()的区别,需要的朋友参考下 .children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...

  7. jquery中filter(fn)的使用研究

    jquery中filter(fn)给出的官方说明是: 筛选出与指定函数返回值匹配的元素集合 这个函数内部将对每个对象计算一次 (正如 '$.each'). 如果调用的函数返回false则这个元素被删除 ...

  8. jquery中prop和attr的区别

    jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) **概述** 获取在匹配的元素集中的第一个元素的属性值. 随着一些内置属性的D ...

  9. jquery中mouseover和mouseenter的区别

    jquery中mouseover和mouseenter的区别 一.总结 一句话总结: 见名知意:enter(进入)和over(在上方)的意思好好思考一下 mouseover就是从子元素回到自己的时候也 ...

随机推荐

  1. [RK3399] ES8316+NS4150 播放视频只有背景音，播放歌曲有的有声音，有的无声音

    CPU:RK3399 系统:Android 音频IC:ES8316 功放IC:NS4150 以前也在 RK3399 上调试过 ES8316,功能都正常,新主板只是更换了功放IC,就出现无声音的问题(仔 ...

  2. python 获取自己exe位置 sys.executable sys.prefix

    exe路径 >>> sys.executable 'C:\\Python27\\python.exe' 1 2 lib路径 >>> sys.prefix 'C:\\ ...

  3. 人脸替换（FaceSwap）的一些思考

    本文链接:https://blog.csdn.net/cy1070779077/article/details/85224347人脸替换(FaceSwap)的一些思考 最一开始,我使用了openCV( ...

  4. AndoridSQLite数据库开发基础教程（6）

    AndoridSQLite数据库开发基础教程(6) 为数据库添加添加空表 如果开发者想要往数据库中添加表和列,操作步骤如下: (1)在打开的数据库中,单击左下方的“+”按钮,弹出Table Edito ...

  5. ArrayAdapter和ListView

    利用ArrayAdapter向ListView中添加数据 <?xml version="1.0" encoding="utf-8"?> <Li ...

  6. Tomcat中用JNDI方式加载JDBC DataSource以连接数据库

    概括一下,大致分为四步:安装驱动,填充context.xml,填充web.xml,编写程序取得连接.通过一个小DEMO对这种配置方式有了一点了解,以tomcat6.0连接mysql5.0.8数据库为例 ...

  7. 【html】window.open()被部分浏览器拦截问题

    一.原因:1.因为在chrome的安全机制里面,非用户触发的window.open方法,是会被拦截的: 二.什么情况下不会被拦截或会被拦截? 1. $('#btn').click(function ( ...

  8. Qt编写气体安全管理系统8-曲线监控

    一.前言 曲线监控模块用的很少,主要就是用来观察某个设备的实时采集的数据和历史采集的数据,可以回放数据,在右侧可以选择对应的通信端口和控制器,然后选择指定的探测器进行观察,从选择的时候开始计时,每个数 ...

  9. 宣化上人：《四种清净明诲》是照妖镜，把所有妖魔鬼怪都给照现原形了(转自学佛网：http://www.xuefo.net/nr/article55/553478.html)

    宣公上人 甘露法雨(顶礼宣公上人) 一般的学者说:<楞严经>是假的,不是佛说的,又有什么考证,又有什么地方记载.这都是他怕<楞严经>,没有办法来应付<楞严经>这个道 ...

  10. 【翻译】The Broadcast State Pattern（广播状态）

    本文翻译自官网:The Broadcast State Pattern Provided APIs (提供的api) BroadcastProcessFunction and KeyedBroadca ...