jquery 循环_jQuery遍历节点

一.遍历节点

​ 1.DOM节点遍历

​ ①通过儿子找父亲

​ 语法:子元素.parentNode

​ 注:儿子只能有一个亲父亲,所以返回的是元素节点,而不是集合。

​ ②通过父亲找儿子

​ 语法:父元素.children

​ 注:父亲可以有任意多个儿子,所以返回的是一个集合,集合中每个元素都是亲儿子的元素节点。

​ 2.jQuery节点遍历

​ ①找亲父亲

​ 语法:子元素.parent()

​ ②找父辈元素

​ 语法:子元素.parents(["选择器"])

​ 注:如果设置了参数()该参数是一个CSS选择器),那么返回符合条件的父辈元素,

​ 如果没有设置参数,那么直接返回所有的父辈元素。

​ ③找亲儿子

​ 语法:父元素.children(["选择器"])

​ ④找子孙后代

​ 语法:父元素.find("选择器")

​ 注:如果选择器设置的为"*",代表返回所有的子孙后代元素。

​ ⑤找所有兄弟

​ 语法:兄弟元素.siblings(["CSS选择器"])

​ 注:如果设置了参数(CSS选择器),那么就从所有的兄弟元素中指定的兄弟;

​ 如果没有设置参数,那么找到的就是所有的兄弟。

​ ⑥找上一个兄弟

​ 语法:兄弟元素.prev()

​ ⑦找前面所有兄弟元素

​ 语法:兄弟元素.prevAll(["CSS选择器"])

​ 注:如果设置了参数,那么就从前面所有的兄弟元素中找指定的元素;

​ 如果没有设置参数,那么找到的就是前面所有的兄弟。

​ ⑧找上一个兄弟

​ 语法:兄弟元素.next()

​ ⑨找后面所有的兄弟元素

​ 语法:兄弟元素.nextAll(["CSS选择器"])

​ 注:如果设置了参数,那么就从后面的所有兄弟元素中找指定的元素;

​ 如果没有设置参数,那么找到的就是后面所有的兄弟元素。

b4c692483215e5937f24fa5724131cbc.png

二.遍历节点--过滤

(从一个jQuery对象中,找符合条件的元素)

​ 1.找第一个元素

​ 语法:jQuery对象.first()

​ 2.找最后一个元素

​ 语法:jQuery对象.last()

​ 3.找指定索引位置元素

​ 语法:jQuery对象.eq(索引)

​ 4.找匹配CSS选择器条件的元素

​ 语法:jQuery对象.filter("CSS选择器")

​ 5.找CSS选择器条件之外的元素

​ 语法:jQuery对象.not("CSS选择器")

注:"jQuery对象[索引]"和"jquery对象.get(索引)"返回的结果是DOM对象;

​ "jQuery对象.eq(索引)"返回的结果是jQuery对象。

56c85a9e2c0e4d00f01413c205a682e7.png

三.$.each()方法

​ 1.作用:$.each()用于遍历数组、js对象和jQuery对象。

​ 2.语法:$.each(对象,function(参数1,参数2){//回调函数中需要执行的业务逻辑

​ })

参数1:如果遍历的是数组,那么指的是数组元素对应的索引;

​ 如果遍历的是js对象,那么指的是js对象的属性名;

​ 如果遍历的是jQuery对象,那么指的是jQuery对象集合的索引。

参数2:如果遍历的是数组,那么指的是索引对应的数组元素;

​ 如果遍历的是js对象,那么指的就是js对象的属性值;

​ 如果遍历的是jQuery对象,那么指的就是索引对应的DOM对象。

028f4d307b843ed8e9a937a47b471b90.png

3.注意:

​ $.each()本质上就是做的循环遍历操作,如果想结束循环遍历可以用break;跳过某次循环遍历可用

​ continue;

四.链式语法

​ 1.核心:①调用时,方法用完毕之后继续使用点语法调用别的方法。

​ ②在每一个方法内部返回this

​ 2 java中的接触到的链式语法

​ StringBuilder和StringBuffer

注:jQuery几乎所有方法都支持链式语法。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值