关于each()find()filter()遍历节点的操作方法

Posted 回青

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于each()find()filter()遍历节点的操作方法相关的知识,希望对你有一定的参考价值。

                                                                                关于each()、find()、filter()遍历节点的操作方法

each语法:

each(fn)  ;

返回值:jQuery

fn:代表对于每个匹配元素所要执行的函数

each()方法共有三种形式

第一种(不带参数):

$(‘img‘).each(function(){

$(this).toggleClass("example");

});

注意:此时的this代指的是DOM对象而不是jQuery对象

如果想得到jQuery对象,可以使用$(this)函数

第二种(带一个参数):

$(‘img‘).each(function(i){

   this.src="test"+i+"jpg";

});

第三种(带两个参数):

$(‘img‘).each(function(i,element){

    this.src="test"+i+"jpg";

// element.src="test"+i+"jpg";

});

概述:以每一个匹配元素作为上下文来执行一个函数

每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素).而且在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合总所处的位置的数字值作为参数(从0开始的整型)。返回‘false’将停止循环(就像在普通的循环中使用‘break’)。返回‘true’跳至下一个循环(就像在普通循环中使用‘continue’)。

最常用的形式是第二种,接下来我们写一个示例

 

 

查找方法--------------------------------find()

搜索所有与指定表达式匹配的元素

示例:

$(‘p‘).find(‘span‘);     //在所有p元素的后代节点中查找span元素

注意:find()是不允许空参的(即必须要跟一个选择器)

情景:如果我就想拿p标签里的所有后代,那应该怎么办?

解决方案:那就用到了我们之前学习的全局选择器(*)  一般情况不会用到

以上是关于关于each()find()filter()遍历节点的操作方法的主要内容,如果未能解决你的问题,请参考以下文章

jQuery中each()find()filter()等节点操作方法

5月25日-js操作DOM遍历子节点

jquery$find(":checkbox").each(遍历的时候怎么去判断是不是被选中

理清Js的各种遍历

_.each _.map _.filter javascript 语法

关于迭代器的for-each遍历集合现象。。。。。