这是jQuery里常用的2个方法。
他们2者功能是完全不同的,而初学者往往会被误导。

首先 我们看.find()方法:
现在有一个页面,里面HTML代码为;
程序代码

<div class="css">
     <p class="rain">测试1</p>
</div>
<div class="rain">
     <p>测试2</p>
</div>

如果我们使用find()方法:

var $find = $("div").find(".rain");
alert( $find.html() ) ;

将会输出:

 


如果使用filter()方法:

var $filter = $("div").filter(".rain");
alert( $filter.html() );

将会输出:

 


也许你已经看出它们的区别了。
find()会在div元素内 寻找 class为rain 的元素。
而filter()则是筛选div的class为rain的元素。
一个是对它的子集操作,一个是对自身集合元素筛选。

另外find()其实还可以用选择器表示:

var $select = $("div .rain");

明白他们的区别了吗?

jQuery基础---filter()和find()的更多相关文章

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

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

  2. jQuery 基础语法

    jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Aja ...

  3. 《jQuery基础教程(第四版)》学习笔记

    本书代码参考:Learning jQuery Code Listing Browser 原书: jQuery基础教程 目录: 第2章 选择元素 1. 使用$()函数 2. 选择符 3. DOM遍历方法 ...

  4. 《jQuery基础》总结

    目前,互联网上最好的jQuery入门教材,是Rebecca Murphey写的<jQuery基础>(jQuery Fundamentals).这本书虽然是入门教材,但也足足有100多页.我 ...

  5. JQuery基础知识梳理篇

    这周没事,优化线上项目,因为前端都在赶项目,我又若菜.于是前端数据展示也要自己来.看javascript看到吐,决定梳理一下Jquery基础知识.敲黑板) 闲扯结束,进入正题. 选择器 介绍 jque ...

  6. 【JavaWeb】jQuery 基础

    jQuery 基础 介绍 顾名思义,它是 JavaScript 和 查询,是辅助 JavaScript 开发的类库. 它的核心思想是 write less, do more. 所以它实现了很多浏览器的 ...

  7. jQuery基础课程

    环境搭建 搭建一个jQuery的开发环境非常方便,可以通过下列几个步骤进行. 下载jQuery文件库 在jQuery的官方网站(http://jquery.com)中,下载最新版本的jQuery文件库 ...

  8. JQuery基础总结上

    最近在慕课网学习JQuery基础课程,发现只是跟随网站的课程学习而不去自己总结扩展的话,很难达到真正学会理解的地步. 于是先在网站上草草过了一遍课程,然后借着今天的这个时间边记录边重新整理学习一下. ...

  9. jQuery基础之选择器

    摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...

随机推荐

  1. ORACLE 事务学习

    以下内容为本人的学习手记,有不足和理解错误的地方,请谨慎参考. 在ORACLE中的事务并不像MSSQL中的事务那样可以随意控制. ORACLE的事务是在进行数据第一次被修改后自动开启的无法显示的开启事 ...

  2. Mock框架

    MoQ(基于.net3.5,c#3.0的mock框架)简单介绍 - 你听海是不是在笑 - 博客园 http://www.cnblogs.com/nuaalfm/archive/2009/11/25/1 ...

  3. [java] JVM监控与调优

    原文出处:http://www.cnblogs.com/zhguang/p/java-jvm-gc.html   光说不练假把式,学习Java GC机制的目的是为了实用,也就是为了在JVM出现问题时分 ...

  4. MVC4 WebAPI(二)——Web API工作方式

    http://www.cnblogs.com/wk1234/archive/2012/05/07/2486872.html 在上篇文章中和大家一起学习了建立基本的WebAPI应用,立刻就有人想到了一些 ...

  5. 加了GO后报 'GO' 附近有语法错误

    单独运行SQL无问题,了加GO就报错. 是你的SQL语句中,有些行的结尾处只有Char(13)没有Char(10),即:只有回车符没有换行符,这种状态在视觉上是没办法区分的. 参考:http://ww ...

  6. 【转】Dubbo是Alibaba开源的分布式服务框架

    Dubbo是Alibaba开源的分布式服务框架,它最大的特点是按照分层的方式来架构,使用这种方式可以使各个层之间解耦合(或者最大限度地松耦合).从服务模型的角度来看,Dubbo采用的是一种非常简单的模 ...

  7. android学习笔记32——资源

    Android应用资源 资源分类: 1.无法直接访问的原生资源,保存于asset目录下 2.可通过R资源清单类访问的资源,保存于res目录下 资源的类型以及存储方式 android要求在res目录下用 ...

  8. android学习笔记18——dpi、dp、sp、xp......

    参考:http://www.cnblogs.com/greatverve/archive/2011/12/28/android-dip-dp-sp-pt-px.html  http://www.360 ...

  9. libcurl上传文件,添加自定义头

    原文  http://www.cnblogs.com/meteoric_cry/p/4285881.html 主题 curl libcurl参数很多,一不小心就容易遇到问题.曾经就遇到过一个很蛋疼的问 ...

  10. Android 自定义ScrollView 支持惯性滑动,惯性回弹效果。支持上拉加载更多

    先讲下原理: ScrollView的子View 主要分为3部分:head头部,滚动内容,fooder底部 我们实现惯性滑动,以及回弹,都是靠超过head或者fooder 就重新滚动到  ,内容的顶部或 ...