DDR爱好者之家

jQuery中each()、find()和filter()等节点操作方法详解(推荐)
站长资源 2024/11/29 佚名
16 1538
DDR爱好者之家 Design By 杰米

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="/UploadFiles/2021-04-02/test0.jpg">


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"htmlcode">



$("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> ]


推荐阅读：


jQuery中的each()详细介绍(推荐)


jQuery each函数源码分析


以上所述是小编给大家介绍的jQuery中each()、find()和filter()等节点操作方法详解(推荐)的相关知识，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米