jQuery基础知识filter()和find()实例说明_jquery

首先 我们看.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");

明白他们的区别了吗?

时间: 2024-10-28 13:08:40

jQuery基础知识filter()和find()实例说明_jquery的相关文章

《jQuery移动开发》—— 1.2 jQuery基础知识

1.2 jQuery基础知识 jQuery移动开发 如果你熟悉JavaScript和CSS的编写,那么编写第一个jQuery脚本将是很熟悉的工作,但是可能会有一些奇怪的地方.jQuery框架是一个JavaScript程序库,也就意味着它是用JavaScript构建的.由于本质上仍然是编写JavaScript,所以基础是相同的,只是将以jQuery框架的方式编写.换句话说,对某些基本功能进行了改进,但是JavaScript的核心--变量.函数.条件语句等--没有变化.所以,仍然使用var关键字.i

jquery基础知识第一讲之认识jquery_jquery

jQuery是一个优秀的JavaScript库,它凭借简洁地语法和跨平台的兼容性,极大地简化了开发人员遍历HTML文档,操作DOM,处理事件,执行动画和开发Ajax操作. jQuery优势: 1.轻量级 2.强大的选择器 3.出色的DOM操作的封装 4.可靠的事件处理机制 5.完善的Ajax 6.不污染顶级变量 7.出色的浏览器兼容性 8.链式操作方式 9.隐式迭代 10.行为层与结构层分离 11.丰富的插件支持 12.完善的文档 13.开源 (1)编写简单的jQuery代码: 注:$ 就是jQ

ThinkPHP3.1基础知识快速入门_php实例

在当今众多的MVC框架中,ThinkPHP是一个快速.简单的基于MVC和面向对象的轻量级PHP开发框架,其遵循Apache2开源协议发布,自从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简的代码的同时,尤其注重开发体验及易用性,并且拥有众多的原创功能和特性,为WEB应用开发提供了强有力的支持.是众多PHP开发人员的首选.本文就ThinkPHP3.1基础知识做一简述. 1.目录结构 ThinkPHP最新版本可以在官方网站(http://thinkphp.cn/down/framewor

基于jQuery实现仿51job城市选择功能实例代码_jquery

前些文章用写过,省市县三级联动,但是感觉选择的时候不够直观,现在改进了下,效果如下图 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="City.aspx.cs" Inherits="System_Select_City" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition

jQuery.uploadify文件上传组件实例讲解_jquery

1.jquery.uploadify简介 在ASP.NET中上传的控件有很多,比如.NET自带的FileUpload,以及SWFUpload,Uploadify等等,尤其后面两个控件的用户体验比较好,无刷新,带上传进度等等.在最近的短信平台开发中,使用Uploadify进行文件上传. Uploadify官网地址是:http://www.uploadify.com/ 可满足项目开发需求. 下载地址:http://www.uploadify.com/wp-content/uploads/files/

jquery验证邮箱格式是否正确实例讲解_jquery

我们来看看都有哪些邮箱: 我们如果一个个的邮箱进行判断,显然是不可能的了. -个完整的Internet邮件地址由以下两个部分组成,格式如下:登录名@主机名.域名 中间用-个表示"在"(at)的符号"@"分开,符号的左边是对方的登录名,右边是完整的主机名,它由主机名与域名 组成.其中,域名由几部分组成,每一部分称为一个子域(Subdomain),各子域之间用圆点"."隔开,每个子域都会告诉用户一些有关这台邮件服务器 的信息. 关键验证的正则表达式:

jquery 动态增加删除行的简单实例(推荐)_jquery

最近写程序,碰巧有动态增加删除行,下面就记录一下 html就不写了,也没有什么,直接上核心了 新增行 function addRow(obj){ //获得table一共有多少行,方便追加的时候给序号赋值 var length = $("#grid tr").length; //获得当前是第几行,以便追加的时候,在该行下进行新增,我这里跨的级别比较多,根据实际层级去定义 var current = $(obj).parent().parent().parent().prevAll().l

通过jquery实现页面的动画效果(实例代码)_jquery

有很多函数可以用来实现动画效果,其中animate函数为最为常见的函数之一.以下为对该函数使用方式的简要介绍. animate函数基本形式 通过animate实现动画效果的基本形式为: $(selector).animate({params},speed,callback); 其中{params}为必须项,它是一个对象,指明了我们希望指定元素通过动画效果运行后,其所具有的的CSS样式,speed和callback则皆为可选项,其中speed指明了动画运行的速度,其值可为数值类型(如1000表示动

jQuery基础知识小结_jquery

1.基础  jquery对象集:   $():jquery对象集合   获取jquery对象集中的元素:    使用索引获取包装器中的javascript元素:var temp = $('img[alt]')[0]    使用jquery的get方法获取jquery对象集中的javascript元素:var temp = $('img[alt]').get(0)    使用jquery的eq方法获取jquery对象集中的jquery对象元素:     $('img[alt]').eq(0)