jQuery中each()、find()、filter()等节点操作方法
1.each(callback)
官方解释:
返回值:jQuery
概述
以每一个匹配的元素作为上下文来执行一个函数。
意味着,每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素)。而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。 返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。
参数
callback
对于每个匹配的元素所要执行的函数
示例
描述:
迭代两个图像,并设置它们的 src 属性。注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。
HTML 代码:
<img/><img/>
jQuery 代码:
$("img").each(function(i){
this.src = "test" + i + ".jpg";
});
结果:
[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]
下面几篇一定要看,定会有很大收获,总结的太好了:
http://www.cnblogs.com/xiaojinhe2/archive/2011/10/12/2208740.html
http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html
http://www.cnblogs.com/Fooo/archive/2011/01/11/1932900.html
2.find(expr|obj|ele)
官方解释:
返回值:jQuery
概述
搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。
所有搜索都依靠jQuery表达式来完成。这个表达式可以使用CSS1-3的选择器语法来写。
参数
expr String
用于查找的表达式
jQuery object object
一个用于匹配元素的jQuery对象
element DOMElement
一个DOM元素
示例
描述:
从所有的段落开始,进一步搜索下面的span元素。与$("p span")相同。
HTML 代码:
<p><span>Hello</span>, how are you?</p>
jQuery 代码:
$("p").find("span")
结果:
[ <span>Hello</span> ]
3.filter(expr|obj|ele|fn)
官方解释:
概述
筛选出与指定表达式匹配的元素集合。
这个方法用于缩小匹配的范围。用逗号分隔多个表达式
参数
expr String
字符串值,包含供匹配当前元素集合的选择器表达式。
jQuery object object
现有的jQuery对象,以匹配当前的元素。
element Expression
一个用于匹配元素的DOM元素。
function(index) Function
一个函数用来作为测试元素的集合。它接受一个参数index,这是元素在jQuery集合的索引。在函数, this指的是当前的DOM元素。
示例
参数selector描述:
保留带有select类的元素
HTML 代码:
<p>Hello</p><p>Hello Again</p><p class="selected">And Again</p>
jQuery 代码:
$("p").filter(".selected")
结果:
[ <p class="selected">And Again</p> ]
推荐文章,一定要看,定有大收获:
http://www.cnblogs.com/qiantuwuliang/archive/2009/10/18/1585682.html
jQuery中each()、find()、filter()等节点操作方法的更多相关文章
- jquery中动态新增的元素节点无法触发事件解决办法
在使用jquery中动态新增的元素节点时会发现添加的事件是无法触发的,我们下面就为各位来详细的介绍此问题的解决办法. 比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为“re ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- jQuery中find和filter的区别
本文来自:http://blog.csdn.net/woshixuye/article/details/7255260 这是jQuery里常用的2个方法. 他们2者功能是完全不同的,而初学者往往会被误 ...
- jQuery中find()和filter()的区别
filter(expr):筛选出与指定表达式匹配的元素的元素集合,其中expr可以是多个选择器的组合.是对自身集合元素的筛选. find()会在元素内寻找匹配元素,而filter()是筛选元素:是对它 ...
- jquery中filter的用法
一.filter的参数类型可分为两种 1.传递选择器 $('a').filter('.external') 2.传递过滤函数 $('a').filter(function(index) { ...
- 关于each()、find()、filter()遍历节点的操作方法
关于each().find().filter()遍历节点的操作方法 each语法: each(fn) ; 返回值:jQuery fn:代表对于每个匹配元素所要执行的函数 each()方法共有三种形式 ...
- jquery中DOM的操作方法
先介绍几个比较简单的方法,不经常用到,做个记录 1. filter() 方法 顾名思义,filter是一个过滤器,如果给定表示 DOM 元素集合的 jQuery 对象,.filter() 方法会用匹配 ...
- jquery中关于append()的用法笔记---append()节点移动与复制之说
jquery中关于append()的用法笔记---append()节点移动与复制之说 今天看一本关于jquery的基础教程,看到其中一段代码关于append()的一行,总是百思不得其解.于是查了查官方 ...
- jquery中filter(fn)的使用研究
jquery中filter(fn)给出的官方说明是: 筛选出与指定函数返回值匹配的元素集合 这个函数内部将对每个对象计算一次 (正如 '$.each'). 如果调用的函数返回false则这个元素被删除 ...
随机推荐
- c#操作word表格
http://www.webshu.net/jiaocheng/programme/ASPNET/200804/6499.html <% if request("infoid" ...
- JavaWeb(李兴华著)开发笔记
1.Java语法-基础 环境变量-JAVA_HOME, PATH, ClassPath 变量名 作用 举例 JAVA_HOME 指向JDK目录 C:\Program Files\Java\jdk1.7 ...
- asp.net首页设置
在web.config中设置首页 <configuration> <system.web> <compilation debug="true" tar ...
- swift 附属脚本
附属脚本是访问对象,集合或序列的快捷方式 struct STest{ let constValue:Int subscript(count:Int)->Int{ return count*con ...
- 数据库时间createtime字段 数据类型的选取
之前是一直在用datetime类型(db)精度到yyyy-MM-dd HH:mm:ss 或者 date类型 精度到 yyyy-MM-dd 用了框架自动注入功能,自己也没去深入没去管他的set赋值值等等 ...
- 数轴上从左到右有n个点a[0],a[1]…,a[n-1],给定一根长度为L的绳子,求绳子最多能覆盖其中的几个点。要求算法复杂度为o(n)。
#include <iostream> using namespace std; int maxCover(int* a, int n, int l) { ; ; ; while(end ...
- Ubuntu中QT使用FFmpeg的奇怪问题
FFmpeg都已经编译安装好了,QT的程序中调用av_register_all却总是在链接阶段报错,经过长时间的摸索,发现时静态链接库的问题,网上给出的答案都只能解决部分问题,所需的全部链接库如下: ...
- 快乐的JS正则表达式(二)
在上一篇中介绍了一个test方法,在本文中将使用另外一个,exec方法可以找到匹配的结果并且返回结果以及位置.exec("正则"): 简单测试: var str = "{ ...
- 【转载】Linux动态库搜索路径的技巧
转自:http://soft.chinabyte.com/os/232/11488732_2.shtml 众所周知,Linux动 态库的默认搜索路径是/lib和/usr/lib.动态库被创建后,一般都 ...
- iOS 8 界面设计 PSD 模板(iPhone 6),免费下载
在 iOS 8 发布不久,Teehan & Lax 就发布了 iOS 8(iPhone6)用户界面的 PSD 模板.该网站分享众多 PSD 模板素材,这些精美的 PSD 界面模板在制作界面原型 ...