jQuery 笔记 —— $.each、$().each方法与选择器过滤写法

￡神魔★判官ぃ 2022-06-07 03:51 265阅读 0赞

**一、$.each 与$().each**

**简单区别：**

$.each 参数可对任意对象进行操作，$().each 可见是对选择器所选的元素进行操作。

**原理：**

是通过call 与apply 方法实现的。

**$.each 用法一：**

**$.each 用法二：**

$.each(obj,function(i,data){
        //i为当前遍历到的胞元素的索引，data为遍历到的胞元素
    });

$().each() 相当于是在$.each() 的基础上把操作对象限制为元素了。

**$().each() 用法一：**

$("div").each(function(){
        //this 指当前遍历到的div 元素
    });

**$().each() 用法二：**

$("div").each(function(i){
        //this 同上。i为当前索引
    });

即两个方法都有两种基本用法，即回调函数有无参数。

**如何退出each 的方法循环？**

只需在内部返回true 即可退出本次，循环，相当于普通for 循环的continue 。

**二、jQuery 选择器过滤**

遍历元素中的过滤器有：first、last、eq、filter、not。

**使用方式一：**

var ele = $(".colorRed").first();
    var ele = $(".colorRed").last();
    var ele = $(".colorRed").eq(0);
    var ele = $(".colorRed").filter("p");
    var ele = $(".colorRed").not("p");

简单说明：

first()：只取**找到的**元素中的第一个（不管前面该元素前面有没有相同标签的元素）。

last()：与first 方法，取最后一个。

eq(index)：取指定索引对应的元素。

filter()：只取符合条件的元素。

not()：与filter 相反，取不符合该天剑的元素。

**使用方式二：**

var ele = $(".colorRed:first()");
    var ele = $(".colorRed:last()");
    var ele = $(".colorRed:eq(0)");
    var ele = $(".colorRed:filter('.fontBold')");//filter此种方式无效
    var ele = $(".colorRed:not('fontBold')");

只是写法不同，可以与选择器写在一起。注意filter 此方式无效，其它都可以。